diff --git a/db b/db deleted file mode 160000 index 9e1c6c9..0000000 --- a/db +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 9e1c6c96da221f7c5434816aaa3c933d1622cb16 diff --git a/db/.editorconfig b/db/.editorconfig new file mode 100644 index 0000000..09d7a33 --- /dev/null +++ b/db/.editorconfig @@ -0,0 +1,11 @@ +# https://EditorConfig.org + +root = true + +[*] +charset = utf-8 +end_of_line = lf +indent_size = 2 +indent_style = space +insert_final_newline = true +trim_trailing_whitespace = true diff --git a/db/.eslintrc.js b/db/.eslintrc.js new file mode 100644 index 0000000..f845b10 --- /dev/null +++ b/db/.eslintrc.js @@ -0,0 +1,3 @@ +module.exports = { + extends: ["blitz"], +} diff --git a/db/.gitignore b/db/.gitignore new file mode 100644 index 0000000..f6fda81 --- /dev/null +++ b/db/.gitignore @@ -0,0 +1,53 @@ +# dependencies +node_modules +.yarn/cache +.yarn/unplugged +.yarn/build-state.yml +.pnp.* +.npm +web_modules/ + +# blitz +/.blitz/ +/.next/ +*.sqlite +*.sqlite-journal +.now +.blitz** +blitz-log.log + +# misc +.DS_Store + +# local env files +.env.local +.env.*.local +.envrc + +# Logs +logs +*.log + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Testing +.coverage +*.lcov +.nyc_output +lib-cov + +# Caches +*.tsbuildinfo +.eslintcache +.node_repl_history +.yarn-integrity + +# Serverless directories +.serverless/ + +# Stores VSCode versions used for testing VSCode extensions +.vscode-test diff --git a/db/.npmrc b/db/.npmrc new file mode 100644 index 0000000..f7777f0 --- /dev/null +++ b/db/.npmrc @@ -0,0 +1,7 @@ +save-exact=true +legacy-peer-deps=true + +public-hoist-pattern[]=next +public-hoist-pattern[]=secure-password +public-hoist-pattern[]=*jest* +public-hoist-pattern[]=@testing-library/* diff --git a/db/.prettierignore b/db/.prettierignore new file mode 100644 index 0000000..ae16525 --- /dev/null +++ b/db/.prettierignore @@ -0,0 +1,10 @@ +.gitkeep +.env* +*.ico +*.lock +.next +.blitz +.yarn +.pnp.* +node_modules +.blitz.config.compiled.js diff --git a/db/README.md b/db/README.md new file mode 100644 index 0000000..6f38190 --- /dev/null +++ b/db/README.md @@ -0,0 +1,116 @@ +[![Blitz.js](https://raw.githubusercontent.com/blitz-js/art/master/github-cover-photo.png)](https://blitzjs.com) + +This is a minimal [Blitz.js](https://github.com/blitz-js/blitz) app. + +# **db** + +## Getting Started + +Run your app in the development mode. + +``` +blitz dev +``` + +Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. + +## Tests + +Runs your tests using Jest. + +``` +yarn test +``` + +Blitz comes with a test setup using [Jest](https://jestjs.io/) and [react-testing-library](https://testing-library.com/). + +## Commands + +Blitz comes with a powerful CLI that is designed to make development easy and fast. You can install it with `npm i -g blitz` + +``` + blitz [COMMAND] + + dev Start a development server + build Create a production build + start Start a production server + export Export your Blitz app as a static application + prisma Run prisma commands + generate Generate new files for your Blitz project + console Run the Blitz console REPL + install Install a recipe + help Display help for blitz + test Run project tests +``` + +You can read more about it on the [CLI Overview](https://blitzjs.com/docs/cli-overview) documentation. + +## What's included? + +Here is the starting structure of your app. + +``` +db +├── app/ +│ ├── pages/ +│ │ ├── _app.tsx +│ │ ├── _document.tsx +│ │ ├── 404.tsx +│ │ ├── index.test.tsx +│ │ └── index.tsx +├── public/ +│ ├── favicon.ico +│ └── logo.png +├── test/ +│ ├── setup.ts +│ └── utils.tsx +├── .eslintrc.js +├── babel.config.js +├── blitz.config.ts +├── jest.config.ts +├── package.json +├── README.md +├── tsconfig.json +└── types.ts +``` + +These files are: + +- The `app/` folder is a container for most of your project. This is where you’ll put any pages or API routes. + +- `public/` is a folder where you will put any static assets. If you have images, files, or videos which you want to use in your app, this is where to put them. + +- `test/` is a folder where you can put test utilities and integration tests. + +- `package.json` contains information about your dependencies and devDependencies. If you’re using a tool like `npm` or `yarn`, you won’t have to worry about this much. + +- `tsconfig.json` is our recommended setup for TypeScript. + +- `.babel.config.js`, `.eslintrc.js`, `.env`, etc. ("dotfiles") are configuration files for various bits of JavaScript tooling. + +- `blitz.config.ts` is for advanced custom configuration of Blitz. [Here you can learn how to use it](https://blitzjs.com/docs/blitz-config). + +- `jest.config.js` contains config for Jest tests. You can [customize it if needed](https://jestjs.io/docs/en/configuration). + +You can read more about it in the [File Structure](https://blitzjs.com/docs/file-structure) section of the documentation. + +### Tools included + +Blitz comes with a set of tools that corrects and formats your code, facilitating its future maintenance. You can modify their options and even uninstall them. + +- **ESLint**: It lints your code: searches for bad practices and tell you about it. You can customize it via the `.eslintrc.js`, and you can install (or even write) plugins to have it the way you like it. It already comes with the [`blitz`](https://github.com/blitz-js/blitz/tree/canary/packages/eslint-config) config, but you can remove it safely. [Learn More](https://blitzjs.com/docs/eslint-config). +- **Husky**: It adds [githooks](https://git-scm.com/docs/githooks), little pieces of code that get executed when certain Git events are triggerd. For example, `pre-commit` is triggered just before a commit is created. You can see the current hooks inside `.husky/`. If are having problems commiting and pushing, check out ther [troubleshooting](https://typicode.github.io/husky/#/?id=troubleshoot) guide. [Learn More](https://blitzjs.com/docs/husky-config). +- **Prettier**: It formats your code to look the same everywhere. You can configure it via the `.prettierrc` file. The `.prettierignore` contains the files that should be ignored by Prettier; useful when you have large files or when you want to keep a custom formatting. [Learn More](https://blitzjs.com/docs/prettier-config). + +## Learn more + +Read the [Blitz.js Documentation](https://blitzjs.com/docs/getting-started) to learn more. + +The Blitz community is warm, safe, diverse, inclusive, and fun! Feel free to reach out to us in any of our communication channels. + +- [Website](https://blitzjs.com) +- [Discord](https://blitzjs.com/discord) +- [Report an issue](https://github.com/blitz-js/blitz/issues/new/choose) +- [Forum discussions](https://github.com/blitz-js/blitz/discussions) +- [How to Contribute](https://blitzjs.com/docs/contributing) +- [Sponsor or donate](https://github.com/blitz-js/blitz#sponsors-and-donations) diff --git a/db/app/core/components/DarkModeToggle.tsx b/db/app/core/components/DarkModeToggle.tsx new file mode 100644 index 0000000..f6de396 --- /dev/null +++ b/db/app/core/components/DarkModeToggle.tsx @@ -0,0 +1,59 @@ +import { Box, IconButton, Theme } from '@mui/material' +import { useTheme } from '@mui/material/styles' +import Brightness4Icon from '@mui/icons-material/Brightness4' +import Brightness7Icon from '@mui/icons-material/Brightness7' +import { ThemeMode } from '../state/ThemeMode' +import { useGlobalState } from '../state/GlobalState' +import { useCallback } from 'react' +import { makeStyles } from '@mui/styles' + +const useStyles = makeStyles((theme: Theme) => ({ + modeToggleButtonHolder: { + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'primary', + flexGrow: 1, + }, + iconButton: { + ml: 1, + }, +})) + +export const DarkModeToggle = () => { + const theme = useTheme() + const classes = useStyles() + const [preferedColorScheme, setPreferedColorScheme] = useGlobalState( + useCallback( + (state) => [state.preferedColorScheme, state.setPreferedColorScheme], + [], + ), + ) + + const toggleColor = () => { + const newTheme = + preferedColorScheme === ThemeMode.LIGHT_MODE + ? ThemeMode.DARK_MODE + : ThemeMode.LIGHT_MODE + setPreferedColorScheme(newTheme) + } + + return ( + + {theme.palette.mode} mode + + {theme.palette.mode === 'dark' ? ( + + ) : ( + + )} + + + ) +} diff --git a/db/app/core/components/Footer.tsx b/db/app/core/components/Footer.tsx new file mode 100644 index 0000000..e2f7541 --- /dev/null +++ b/db/app/core/components/Footer.tsx @@ -0,0 +1,23 @@ +import {Box, Typography} from '@mui/material' +import {makeStyles} from '@mui/styles' + +const useStyles = makeStyles(() => ({ + footerHolder: { + display: 'flex', + flex: '0 1 3vh', + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'center', + padding: '0 10vw 0 10vw' + } +})) + +export const Footer = () => { + const classes = useStyles() + + return ( + + SPT-Aki ©2021 Created by Rev and Shirito + + ) +} diff --git a/db/app/core/components/Header.tsx b/db/app/core/components/Header.tsx new file mode 100644 index 0000000..2296d4f --- /dev/null +++ b/db/app/core/components/Header.tsx @@ -0,0 +1,86 @@ +import { Box, Link, Theme } from '@mui/material' +import { makeStyles } from '@mui/styles' +import { useCallback } from 'react'; +import { useGlobalState } from '../state/GlobalState'; +import { HeaderForm } from './HeaderForm'; + +const useStyles = makeStyles((theme: Theme) => ({ + headerContainer: { + display: 'flex', + flex: '0 1 3vh', + flexDirection: 'row', + backgroundColor: theme.palette.background.paper, + alignItems: 'center', + padding: '0 10vw 0 10vw', + }, + linksContainer: { + display: 'flex', + flexGrow: 2, + flexDirection: 'row', + alignItems: 'center', + height: '100%', + }, + formContainer: { + display: 'flex', + flexGrow: 1, + flexDirection: 'row', + alignItems: 'center', + height: '100%', + }, + link: { + display: 'flex', + padding: '0 1vw 0 1vw', + height: '100%', + alignItems: 'center', + borderBottom: `1px solid transparent`, + '&:hover': { + borderBottom: `1px solid ${theme.palette.action.hover}`, + }, + }, +})) + +export const Header = () => { + const classes = useStyles() + const websiteLink = useGlobalState(useCallback((state) => state.sptarkovWebsiteUrl,[])) + const workshopLink = useGlobalState(useCallback((state) => state.sptarkovWorkshopUrl,[])) + const documentationLink = useGlobalState(useCallback((state) => state.sptarkovDocumentationUrl,[])) + + return ( + <> + + + + Website + + + Workshop + + + Documentation + + + + + + + + ) +} diff --git a/db/app/core/components/HeaderForm.tsx b/db/app/core/components/HeaderForm.tsx new file mode 100644 index 0000000..41e6388 --- /dev/null +++ b/db/app/core/components/HeaderForm.tsx @@ -0,0 +1,29 @@ +import { DarkModeToggle } from './DarkModeToggle' +import { LocaleSelect } from './LocaleSelect' +import { JsonTheme } from './JsonTheme' +import { Theme } from '@mui/material' +import { makeStyles } from '@mui/styles'; + +const useStyles = makeStyles((theme: Theme) => ({ + form: { + display: 'flex', + flexDirection: 'row', + flexGrow: 1, + justifyContent: 'flex-end', + height: '100%' + }, +})); + +export const HeaderForm = () => { + const classes = useStyles(); + + return ( + <> +
+ + + + + + ) +} diff --git a/db/app/core/components/JsonTheme.tsx b/db/app/core/components/JsonTheme.tsx new file mode 100644 index 0000000..f6b4529 --- /dev/null +++ b/db/app/core/components/JsonTheme.tsx @@ -0,0 +1,69 @@ +import { + Box, + FormControl, + MenuItem, + Select, + Theme, +} from '@mui/material' +import { makeStyles } from '@mui/styles' +import { ReactJsonViewThemes } from '../state/ReactJsonViewThemes' +import { LocalStorageKeys } from '../dto/SaveKeys' +import { useGlobalState } from '../state/GlobalState' +import { useCallback } from 'react' + +const useStyles = makeStyles((theme: Theme) => ({ + jsonHolder: { + display: 'flex', + flexGrow: 1, + padding: '0 0.5vw 0 0.5vw' + }, + select: { + display: 'flex', + flexGrow: 1 + } +})) + +export const JsonTheme = () => { + const classes = useStyles() + const [preferedJsonViewerTheme, setPreferedJsonViewerTheme] = useGlobalState( + useCallback( + (state) => [ + state.preferedJsonViewerTheme, + state.setPreferedJsonViewerTheme, + ], + [], + ), + ) + return ( + <> + + + + + + + ) +} diff --git a/db/app/core/components/LocaleSelect.tsx b/db/app/core/components/LocaleSelect.tsx new file mode 100644 index 0000000..5de8bd4 --- /dev/null +++ b/db/app/core/components/LocaleSelect.tsx @@ -0,0 +1,54 @@ +import { Select, MenuItem, Theme, Box, FormControl } from '@mui/material' +import {makeStyles} from '@mui/styles' +import { useCallback, useEffect } from 'react'; +import { useGlobalState } from '../state/GlobalState' + +const useStyles = makeStyles((theme: Theme) => ({ + localeHolder: { + display: 'flex', + flexGrow: 1, + padding: '0 0.5vw 0 0.5vw' + }, + select: { + display: 'flex', + flexGrow: 1 + } +})) + + + +export const LocaleSelect = () => { + const classes = useStyles() + const [preferedLocale, setPreferedLocale] = useGlobalState(useCallback(state => [state.preferedLocale, state.setPreferedLocale],[])) + const [localesList, refreshLocalesList] = useGlobalState(useCallback(state => [state.localesList, state.refreshLocalesList],[])) + + useEffect(()=> {refreshLocalesList();}, [refreshLocalesList]) + + return ( + <> + + + + + + + ) +} diff --git a/db/app/core/dto/ItemData.ts b/db/app/core/dto/ItemData.ts new file mode 100644 index 0000000..b8f7ce9 --- /dev/null +++ b/db/app/core/dto/ItemData.ts @@ -0,0 +1,6 @@ +export interface ItemData { + _id: string + _name: string + _parent?: string + _type?: string +} \ No newline at end of file diff --git a/db/app/core/dto/ItemHierarchy.ts b/db/app/core/dto/ItemHierarchy.ts new file mode 100644 index 0000000..e51d10a --- /dev/null +++ b/db/app/core/dto/ItemHierarchy.ts @@ -0,0 +1,5 @@ +import { ItemWithLocale } from './ItemWithLocale'; + +export interface ItemHierarchy { + [id: string]: ItemWithLocale +} \ No newline at end of file diff --git a/db/app/core/dto/ItemLocale.ts b/db/app/core/dto/ItemLocale.ts new file mode 100644 index 0000000..2bdbc62 --- /dev/null +++ b/db/app/core/dto/ItemLocale.ts @@ -0,0 +1,5 @@ +export interface ItemLocale { + Description: string + Name: string + ShortName: string +} \ No newline at end of file diff --git a/db/app/core/dto/ItemOption.ts b/db/app/core/dto/ItemOption.ts new file mode 100644 index 0000000..9d67b54 --- /dev/null +++ b/db/app/core/dto/ItemOption.ts @@ -0,0 +1,5 @@ +export interface ItemOption { + id: string + name: string + shortName?: string +} \ No newline at end of file diff --git a/db/app/core/dto/ItemWithLocale.ts b/db/app/core/dto/ItemWithLocale.ts new file mode 100644 index 0000000..d0de32b --- /dev/null +++ b/db/app/core/dto/ItemWithLocale.ts @@ -0,0 +1,7 @@ +import { ItemData } from './ItemData'; +import { ItemLocale } from './ItemLocale'; + +export interface ItemWithLocale { + item: ItemData + locale: ItemLocale +} \ No newline at end of file diff --git a/db/app/core/dto/SaveKeys.ts b/db/app/core/dto/SaveKeys.ts new file mode 100644 index 0000000..2063df2 --- /dev/null +++ b/db/app/core/dto/SaveKeys.ts @@ -0,0 +1,10 @@ +export enum LocalStorageKeys { + PREFERED_COLOR_SCHEME = 'db.sp-tarkov.com-prefered-color-scheme', + PREFERED_JSON_THEME = 'db.sp-tarkov.com-prefered-json-theme', + PREFERED_LOCALE = 'db.sp-tarkov.com-prefered-locale' +} + +export enum SessionStorageKeys { + LOCALES = 'db.sp-tarkov.com-locales', + ITEMS_HIERARCHY = 'db.sp-tarkov.com-items-hierarchy', +} \ No newline at end of file diff --git a/db/app/core/layouts/Layout.tsx b/db/app/core/layouts/Layout.tsx new file mode 100644 index 0000000..3af0c0c --- /dev/null +++ b/db/app/core/layouts/Layout.tsx @@ -0,0 +1,33 @@ +import {Box} from '@mui/material' +import {Footer} from '../components/Footer' +import {Header} from '../components/Header' +import {makeStyles} from "@mui/styles"; +import React, { PropsWithChildren } from "react"; +// import {InteractiveArea} from "./InteractiveArea"; +// import {PageNotFound} from "./PageNotFound"; + +const useStyles = makeStyles(() => ({ + container: { + background: 'background.default', + display: 'flex', + flexDirection: 'column', + flexGrow: 1, + height: '100vh', + maxheight: '100vh', + } +})) + +interface Props {} + +export const Layout = (props: PropsWithChildren) => { + const classes = useStyles(); + return ( + <> + +
+ {props.children} +