#!/usr/bin/env bash

# Exit on error
set -e

# # Get app name from current directory
app_name="${PWD##*/}"

# Get latest version of Angular CLI
npm install -g @angular/cli@latest

# Generate angular project
ng new $app_name --minimal --strict --routing --ssr=false --style=css --skip-git --skip-install --inline-template=false --standalone --directory .

# Configure prettier
echo '{
  "tabWidth": 2,
  "useTabs": false,
  "singleQuote": true,
  "trailingComma": "none",
  "endOfLine": "lf",
  "arrowParens": "always",
  "printWidth": 120
}' > .prettierrc

# Configure your template paths
echo "/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: 'class',
  content: ['./src/**/*.{html,ts}'],
  corePlugins: {
    textOpacity: false,
    backgroundOpacity: false,
    borderOpacity: false
  },
  darkMode: 'class',
  theme: {
    extend: {
      screens: {
        xs: '375px'
      },
      colors: {
        // Dark (Mantine)
        // https://v6.mantine.dev/guides/dark-theme/
        dark: {
          100: '#a6a7ab',
          200: '#909296',
          300: '#5c5f66',
          400: '#373a40',
          500: '#2c2e33',
          600: '#25262b',
          700: '#1a1b1e',
          800: '#141517',
          900: '#101113'
        }
      }
    }
  },
  plugins: []
};" > tailwind.config.js

# Add the Tailwind directives to your CSS
echo '@tailwind base;
@tailwind components;
@tailwind utilities;' > src/styles.css

# Configure VSCode
echo '{
  "files.insertFinalNewline": true,
  "files.trimTrailingWhitespace": true,
  "editor.formatOnSave": true,
  "css.validate": false,
  "files.associations": {
    "*.css": "tailwindcss"
  },
  "editor.quickSuggestions": {
    "strings": true
  },
  "tailwindCSS.emmetCompletions": true,
  "editor.inlineSuggest.enabled": true,
  "tailwindCSS.includeLanguages": {
    "plaintext": "html"
  }
}' > .vscode/settings.json


# Overwrite the default app.component.html
curl -s https://start.workers.rocks/angular/app.component.html > src/app/app.component.html

# Install tailwindcss (and Angular, that has been skipped in the ng new command)
npm install -D tailwindcss postcss autoprefixer

# Disable Angular CLI analytics
jq '.cli.analytics = false' angular.json > tmp.$$.json && mv -f tmp.$$.json angular.json

# Add dev scripts to package.json
jq '.scripts += { "dev": "ng serve" }' package.json > tmp.$$.json && mv -f tmp.$$.json package.json

git init

git add .

git commit -m "Initial commit"