Project set up

IFRCGo · Mar 19, 2024 · 912d011 · 912d011
1 parent 24665b8
commit 912d011
Show file tree

Hide file tree

Showing 19 changed files with 191 additions and 307 deletions.
diff --git a/.unimportedrc.json b/.unimportedrc.json
@@ -4,8 +4,5 @@
     "ignoreUnimported": ["**/*.d.ts"],
     "ignoreUnused": [],
     "extensions": [".ts", ".js", ".tsx", ".jsx"],
-    "aliases": {
-        "#views/*": ["./src/views/*"],
-        "#utils/*": ["./src/utils/*"]
-    }
+    "aliases": {}
 }
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -2,9 +2,7 @@ version: '3.8'
 services:
   react:
     build: .
-    command: sh -c 'yarn install && yarn dev --host'
-    environment:
-      APP_TITLE: ${APP_TITLE:-React Base App}
+    command: sh -c 'yarn install && yarn start --host'
     volumes:
       - .:/code
     ports:

diff --git a/eslint.config.js b/eslint.config.js
@@ -1,10 +1,8 @@
 import { FlatCompat } from '@eslint/eslintrc';
 import js from '@eslint/js';
-import path from 'path';
-import { fileURLToPath } from 'url';
+import process from 'process';
 
-const filename = fileURLToPath(import.meta.url);
-const dirname = path.dirname(filename);
+const dirname = process.cwd();
 
 const compat = new FlatCompat({
     baseDirectory: dirname,
@@ -13,9 +11,11 @@ const compat = new FlatCompat({
 
 const appConfigs = compat.config({
     env: {
+        node: true,
         browser: true,
         es2020: true,
     },
+    root: true,
     extends: [
         'airbnb',
         'airbnb/hooks',
@@ -30,14 +30,18 @@ const appConfigs = compat.config({
     plugins: [
         '@typescript-eslint',
         'react-refresh',
+        'simple-import-sort',
+        'import-newlines'
     ],
     settings: {
         'import/parsers': {
-          '@typescript-eslint/parser': ['.ts', '.tsx']
+            '@typescript-eslint/parser': ['.ts', '.tsx']
         },
         'import/resolver': {
-          typescript: {
-            project: './tsconfig.json',
+            typescript: {
+                project: [
+                    './tsconfig.json',
+                ],
             },
         },
     },
@@ -72,6 +76,7 @@ const appConfigs = compat.config({
         'import/no-cycle': ['error', { allowUnsafeDynamicCyclicDependency: true }],
 
         'react/react-in-jsx-scope': 'off',
+        'camelcase': 'off',
 
         'react/jsx-indent': ['error', 4],
         'react/jsx-indent-props': ['error', 4],
@@ -83,10 +88,39 @@ const appConfigs = compat.config({
         'react-hooks/exhaustive-deps': 'warn',
 
         'react/require-default-props': ['warn', { ignoreFunctionalComponents: true }],
+        'simple-import-sort/imports': 'warn',
+        'simple-import-sort/exports': 'warn',
+        'import-newlines/enforce': ['warn', 1]
     },
+    overrides: [
+        {
+            files: ['*.js', '*.jsx', '*.ts', '*.tsx'],
+            rules: {
+                'simple-import-sort/imports': [
+                    'error',
+                    {
+                        'groups': [
+                            // side effect imports
+                            ['^\\u0000'],
+                            // packages `react` related packages come first
+                            ['^react', '^@?\\w'],
+                            // internal packages
+                            ['^#.+$'],
+                            // parent imports. Put `..` last
+                            // other relative imports. Put same-folder imports and `.` last
+                            ['^\\.\\.(?!/?$)', '^\\.\\./?$', '^\\./(?=.*/)(?!/?$)', '^\\.(?!/?$)', '^\\./?$'],
+                            // style imports
+                            ['^.+\\.json$', '^.+\\.module.css$'],
+                        ]
+                    }
+                ]
+            }
+        }
+    ]
 }).map((conf) => ({
     ...conf,
     files: ['src/**/*.tsx', 'src/**/*.jsx', 'src/**/*.ts', 'src/**/*.js'],
+    ignores: ['src/generated/types.ts'],
 }));
 
 const otherConfig = {

diff --git a/index.html b/index.html
@@ -8,26 +8,58 @@
         <link
             rel="icon"
             type="image/svg+xml"
-            href="/pineapple.svg"
+            href=""
         />
         <meta
             name="viewport"
             content="width=device-width, initial-scale=1.0"
         />
         <meta
             name="description"
-            content="React base app with sane some oompf"
+            content=""
         />
         <title>
             %APP_TITLE%
         </title>
-        <link href="https://api.fontshare.com/v2/css?f[]=nunito@300,700,400&f[]=bebas-neue@400&display=swap" rel="stylesheet">
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+        <!-- link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Montserrat:wght@300;400;600;700&family=OpenSans:wght@300;400;600;700&display=swap" rel="stylesheet" -->
+        <style>
+            html, body {
+                margin: 0;
+                padding: 0;
+            }
+
+            body {
+                font-family: Poppins, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+            }
+
+            @media screen {
+                body {
+                    background-color: #f7f7f7;
+                }
+            }
+
+            #webapp-preload {
+                width: 100vw;
+                height: 100vh;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+            }
+        </style>
     </head>
     <body>
         <noscript>
             %APP_TITLE% needs JS.
         </noscript>
-        <div id="webapp-root" />
+        <div id="webapp-root">
+            <div id="webapp-preload">
+                %APP_TITLE% loading...
+            </div>
+        </div>
         <script
             type="module"
             src="/src/index.tsx"

diff --git a/package.json b/package.json
@@ -1,63 +1,79 @@
 {
-    "name": "react-base-app",
-    "private": true,
+    "name": "alert-hub",
     "version": "0.0.0",
     "type": "module",
+    "private": true,
     "scripts": {
         "start": "vite",
-        "dev": "vite",
         "build": "vite build",
-        "preview": "vite preview",
-        "check-unused": "unimported",
-        "test": "vitest",
-        "coverage": "vitest run --coverage",
-        "typecheck": "tsc",
-        "lint": "eslint src",
-        "css-lint": "stylelint ./src/**/*.css"
+        "lint:js": "eslint src",
+        "lint:css": "stylelint \"./src/**/*.css\"",
+        "lint:unused": "unimported",
+        "lint:translation": "node ./scripts/translator.js",
+        "lint": "yarn lint:js && yarn lint:css && yarn lint:unused && yarn lint:translation",
+        "postinstall": "patch-package"
     },
     "dependencies": {
-        "@togglecorp/fujs": "^2.0.0",
+        "@ifrc-go/icons": "^1.3.1",
+        "@mapbox/mapbox-gl-draw": "^1.2.0",
+        "@togglecorp/fujs": "^2.1.1",
+        "@togglecorp/re-map": "^0.2.0-beta-6",
+        "@turf/bbox": "^6.5.0",
+        "@turf/buffer": "^6.5.0",
+        "mapbox-gl": "^1.13.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-router-dom": "^6.11.1"
     },
     "devDependencies": {
-        "@eslint/eslintrc": "^3.0.2",
-        "@julr/vite-plugin-validate-env": "^1.1.1",
+        "@eslint/eslintrc": "^2.0.3",
+        "@julr/vite-plugin-validate-env": "^1.0.1",
+        "@types/mapbox-gl": "^1.13.0",
         "@types/node": "^20.1.3",
         "@types/react": "^18.0.28",
         "@types/react-dom": "^18.0.11",
-        "@typescript-eslint/eslint-plugin": "^7.1.1",
-        "@typescript-eslint/parser": "^7.1.1",
-        "@vitejs/plugin-react-swc": "^3.0.0",
+        "@typescript-eslint/eslint-plugin": "^5.59.5",
+        "@typescript-eslint/parser": "^5.59.5",
+        "@vitejs/plugin-react-swc": "^3.5.0",
         "autoprefixer": "^10.4.14",
+        "cross-var": "^1.1.0",
+        "dotenv-cli": "^7.2.1",
         "eslint": "^8.40.0",
         "eslint-config-airbnb": "^19.0.4",
         "eslint-import-resolver-typescript": "^3.5.5",
         "eslint-plugin-import": "^2.27.5",
+        "eslint-plugin-import-exports-imports-resolver": "^1.0.1",
+        "eslint-plugin-import-newlines": "^1.3.4",
         "eslint-plugin-jsx-a11y": "^6.7.1",
         "eslint-plugin-react": "^7.32.2",
         "eslint-plugin-react-hooks": "^4.6.0",
-        "eslint-plugin-react-refresh": "^0.4.5",
-        "happy-dom": "^13.6.2",
-        "patch-package": "^8.0.0",
+        "eslint-plugin-react-refresh": "^0.3.4",
+        "eslint-plugin-simple-import-sort": "^10.0.0",
+        "fast-glob": "^3.3.0",
+        "happy-dom": "^9.18.3",
+        "openapi-typescript": "6.5.5",
+        "patch-package": "^7.0.0",
         "postcss": "^8.3.0",
         "postcss-nested": "^6.0.1",
         "postcss-normalize": "^10.0.1",
-        "postcss-preset-env": "^9.4.0",
+        "postcss-preset-env": "^8.3.2",
         "postinstall-postinstall": "^2.1.0",
-        "stylelint": "^16.2.1",
+        "rollup-plugin-visualizer": "^5.9.0",
+        "stylelint": "^15.6.1",
         "stylelint-config-concentric": "^2.0.2",
-        "stylelint-config-recommended": "^14.0.0",
+        "stylelint-config-recommended": "^12.0.0",
         "stylelint-no-unused-selectors": "git+https://github.com/toggle-corp/stylelint-no-unused-selectors#e0831e1",
-        "stylelint-value-no-unknown-custom-properties": "^6.0.1",
+        "stylelint-value-no-unknown-custom-properties": "^4.0.0",
+        "surge": "^0.23.1",
         "typescript": "^5.0.4",
-        "unimported": "^1.28.0",
-        "vite": "^5.1.5",
-        "vite-plugin-checker": "^0.6.0",
-        "vite-plugin-compression2": "^1.0.0",
-        "vite-plugin-webfont-dl": "^3.7.4",
-        "vite-tsconfig-paths": "^4.2.0",
-        "vitest": "^1.3.1"
+        "unimported": "1.28.0",
+        "vite": "^5.0.10",
+        "vite-plugin-checker": "^0.6.2",
+        "vite-plugin-compression2": "^0.11.0",
+        "vite-plugin-radar": "^0.9.2",
+        "vite-plugin-svgr": "^4.2.0",
+        "vite-plugin-webfont-dl": "^3.9.1",
+        "vite-tsconfig-paths": "^4.2.2",
+        "vitest": "^1.1.0"
     }
 }
diff --git a/public/pineapple.svg b/public/pineapple.svg
diff --git a/src/App/PageError/index.tsx b/src/App/PageError/index.tsx
@@ -1,6 +1,4 @@
-import {
-    useRouteError,
-} from 'react-router-dom';
+import { useRouteError } from 'react-router-dom';
 
 function PageError() {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any