ZZO MVPish

frzyc · Jan 13, 2025 · c708ad5 · c708ad5
1 parent 451d0e2
commit c708ad5
Show file tree

Hide file tree

Showing 149 changed files with 6,096 additions and 6 deletions.
diff --git a/apps/frontend/vite.config.mts b/apps/frontend/vite.config.mts
@@ -95,7 +95,7 @@ export default defineConfig({
     include: ['src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
     reporters: ['default'],
     coverage: {
-      reportsDirectory: '../../coverage/apps/sr-frontend',
+      reportsDirectory: '../../coverage/apps/frontend',
       provider: 'v8',
     },
   },

diff --git a/apps/zzz-frontend/.babelrc b/apps/zzz-frontend/.babelrc
@@ -0,0 +1,3 @@
+{
+  "presets": ["@nx/js/babel"]
+}
diff --git a/apps/zzz-frontend/.eslintrc.json b/apps/zzz-frontend/.eslintrc.json
@@ -0,0 +1,23 @@
+{
+  "extends": ["plugin:@nx/react", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "parserOptions": {
+    "project": "tsconfig.eslint.json"
+  },
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {
+        "@typescript-eslint/consistent-type-imports": "error"
+      }
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/apps/zzz-frontend/README.md b/apps/zzz-frontend/README.md
@@ -0,0 +1,17 @@
+# zzz-frontend
+
+Frontend code for static Star Rail Optimizer.
+
+## Dev Server
+
+Run `nx serve zzz-frontend`
+
+## Preview
+
+To preview the production build locally, run `nx build zzz-frontend` and then `nx preview zzz-frontend`
+
+## Adding new assets
+
+Either add assets to `apps/zzz-frontend/assets` or configure the call to `viteStaticCopy` in `vite.config.mts` to copy library assets to the `assets` folder.
+
+You can then reference them without any leading path, e.g. `notification.mp3`.
diff --git a/apps/zzz-frontend/assets/.gitkeep b/apps/zzz-frontend/assets/.gitkeep
diff --git a/apps/zzz-frontend/index.html b/apps/zzz-frontend/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Zenless Optimizer</title>
+    <base href="" />
+
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+    <link rel="manifest" href="/site.webmanifest" />
+    <link rel="stylesheet" href="src/styles.scss" />
+  </head>
+  <body>
+    <script type="module" src="src/main.tsx"></script>
+    <div id="root"></div>
+  </body>
+</html>
diff --git a/apps/zzz-frontend/project.json b/apps/zzz-frontend/project.json
@@ -0,0 +1,26 @@
+{
+  "name": "zzz-frontend",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "sourceRoot": "apps/zzz-frontend/src",
+  "tags": [],
+  "// targets": "to see all targets run: nx show project zzz-frontend --web",
+  "targets": {
+    "typecheck": {
+      "executor": "nx:run-commands",
+      "options": {
+        "cwd": "apps/zzz-frontend",
+        "commands": ["tsc -p tsconfig.app.json --noEmit"]
+      },
+      "dependsOn": ["eslint:lint"]
+    },
+    "build": {
+      "cache": false
+    }
+  },
+  "implicitDependencies": [
+    "common-localization",
+    "sr-localization",
+    "sr-dm-localization"
+  ]
+}
diff --git a/apps/zzz-frontend/public/android-chrome-192x192.png b/apps/zzz-frontend/public/android-chrome-192x192.png
diff --git a/apps/zzz-frontend/public/android-chrome-512x512.png b/apps/zzz-frontend/public/android-chrome-512x512.png
diff --git a/apps/zzz-frontend/public/apple-touch-icon.png b/apps/zzz-frontend/public/apple-touch-icon.png
diff --git a/apps/zzz-frontend/public/favicon-16x16.png b/apps/zzz-frontend/public/favicon-16x16.png
diff --git a/apps/zzz-frontend/public/favicon-32x32.png b/apps/zzz-frontend/public/favicon-32x32.png
diff --git a/apps/zzz-frontend/public/favicon.ico b/apps/zzz-frontend/public/favicon.ico
diff --git a/apps/zzz-frontend/public/site.webmanifest b/apps/zzz-frontend/public/site.webmanifest
@@ -0,0 +1,19 @@
+{
+  "name": "Star Rail Optimizer",
+  "short_name": "SRO",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#1b263b",
+  "background_color": "#0C1020",
+  "display": "standalone"
+}
diff --git a/apps/zzz-frontend/src/app/App.tsx b/apps/zzz-frontend/src/app/App.tsx
@@ -0,0 +1,69 @@
+import { ScrollTop } from '@genshin-optimizer/common/ui'
+import '@genshin-optimizer/sr/i18n' // import to load translations
+import { theme } from '@genshin-optimizer/sr/theme'
+import { DatabaseProvider } from '@genshin-optimizer/zzz/db-ui'
+import {
+  Box,
+  Container,
+  CssBaseline,
+  Skeleton,
+  StyledEngineProvider,
+  ThemeProvider,
+} from '@mui/material'
+import { Suspense, lazy } from 'react'
+import { HashRouter, Route, Routes } from 'react-router-dom'
+import Header from './Header'
+import PageHome from './PageHome'
+
+const PageDiscs = lazy(() => import('@genshin-optimizer/zzz/page-discs'))
+const PageOptimize = lazy(() => import('@genshin-optimizer/zzz/page-optimize'))
+
+const PageSettings = lazy(() => import('@genshin-optimizer/zzz/page-settings'))
+
+export default function App() {
+  return (
+    <StyledEngineProvider injectFirst>
+      {/* https://mui.com/guides/interoperability/#css-injection-order-2 */}
+      <ThemeProvider theme={theme}>
+        <CssBaseline enableColorScheme />
+        <DatabaseProvider>
+          <HashRouter basename="/">
+            <Content />
+            <ScrollTop />
+          </HashRouter>
+        </DatabaseProvider>
+      </ThemeProvider>
+    </StyledEngineProvider>
+  )
+}
+
+function Content() {
+  return (
+    <Box
+      display="flex"
+      flexDirection="column"
+      minHeight="100vh"
+      position="relative"
+    >
+      <Header anchor="back-to-top-anchor" />
+
+      <Container maxWidth="xl" sx={{ px: { xs: 0.5, sm: 1 } }}>
+        <Suspense
+          fallback={
+            <Skeleton
+              variant="rectangular"
+              sx={{ width: '100%', height: '100%' }}
+            />
+          }
+        >
+          <Routes>
+            <Route index element={<PageHome />} />
+            <Route path="/discs" element={<PageDiscs />} />
+            <Route path="/optimize" element={<PageOptimize />} />
+            <Route path="/settings" element={<PageSettings />} />
+          </Routes>
+        </Suspense>
+      </Container>
+    </Box>
+  )
+}