init frontend

This commit is contained in:
2025-02-08 19:00:10 +08:00
parent 4685c10cba
commit d95f032aef
17 changed files with 5736 additions and 0 deletions

28
AceJobAgency.client/.gitignore vendored Normal file
View File

@@ -0,0 +1,28 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# Generated by specta
# will have generated bindings to tauri's commands
src/bindings.ts

View File

@@ -0,0 +1 @@
public-hoist-pattern[]=*@nextui-org/*

View File

@@ -0,0 +1,11 @@
# Tauri + React + Vite + Typescript + TailwindCSS + NextUI + React Router DOM
Adam's custom tauri app template for rapid prototyping
Uses Tauri 2.0 RC.
- Light / Dark mode support
- Routing support
- Window resize optimization
All that needs to be done is to hit `Cmd` + `Shift` + `H` to replace all occurances of `ace-job-agency` with a custom app name.

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ace-job-agency</title>
</head>
<body class="text-foreground bg-background absolute inset-0">
<script type="module">
const prefersDarkMode = window.matchMedia("(prefers-color-scheme: dark)");
const body = document.querySelector("body");
function updateTheme() {
if (prefersDarkMode.matches) {
body.classList.add("dark");
} else {
body.classList.remove("dark");
}
}
updateTheme();
prefersDarkMode.addEventListener("change", updateTheme);
</script>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

View File

@@ -0,0 +1,36 @@
{
"name": "ace-job-agency",
"private": true,
"version": "0.0.124",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"preview": "vite preview",
"tauri": "tauri"
},
"dependencies": {
"@heroui/react": "^2.6.14",
"@tabler/icons-react": "^3.30.0",
"@tauri-apps/api": "^2.2.0",
"@tauri-apps/plugin-os": "^2.2.0",
"@tauri-apps/plugin-shell": "^2.2.0",
"framer-motion": "^11.18.2",
"lodash": "^4.17.21",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router-dom": "^6.29.0"
},
"devDependencies": {
"@tauri-apps/cli": "^2.2.7",
"@types/lodash": "^4.17.15",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"postcss": "^8.5.1",
"tailwindcss": "^3.4.17",
"typescript": "^5.7.3",
"vite": "^5.4.14"
}
}

5460
AceJobAgency.client/pnpm-lock.yaml generated Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

View File

@@ -0,0 +1,17 @@
import { Route, Routes } from "react-router-dom";
import DefaultLayout from "./layouts/DefaultLayout";
import HomePage from "./pages/HomePage";
export default function App() {
return (
<Routes>
<Route>
<Route path="/">
<Route element={<DefaultLayout />}>
<Route index element={<HomePage />} />
</Route>
</Route>
</Route>
</Routes>
);
}

View File

@@ -0,0 +1,19 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
* {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
/*
Introduced in Internet Explorer 10.
See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
*/
-ms-user-select: none;
user-select: none;
-webkit-user-drag: none;
cursor: default;
}

View File

@@ -0,0 +1,19 @@
import { Outlet } from "react-router-dom";
export default function DefaultLayout() {
return (
<div className="relative flex flex-col justify-between">
<div className="flex flex-col min-h-screen">
<div className="flex-grow">
<Outlet />
</div>
</div>
{/*
A div that becomes black in dark mode to cover white color parts
of the website when scrolling past the window's original view.
*/}
<div className="fixed -z-50 dark:bg-black inset-0 w-full h-full"></div>
</div>
);
}

View File

@@ -0,0 +1,22 @@
import React from "react";
import ReactDOM from "react-dom/client";
import { HeroUIProvider } from "@heroui/react";
import { BrowserRouter } from "react-router-dom";
import App from "./App.tsx";
import "./index.css";
document.addEventListener("contextmenu", (event) => {
event.preventDefault();
});
ReactDOM.createRoot(document.getElementById("root")!).render(
<React.StrictMode>
<BrowserRouter>
<HeroUIProvider>
<main>
<App />
</main>
</HeroUIProvider>
</BrowserRouter>
</React.StrictMode>
);

View File

@@ -0,0 +1,7 @@
export default function HomePage() {
return (
<div className="absolute inset-0 w-full h-full">
<p className="p-8 pt-12 text-3xl">Ace Job Agency</p>
</div>
);
}

1
AceJobAgency.client/src/vite-env.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
/// <reference types="vite/client" />

View File

@@ -0,0 +1,15 @@
const { heroui } = require("@heroui/react");
/** @type {import('tailwindcss').Config} */
export default {
content: [
"./index.html",
"./src/**/*.{js,ts,jsx,tsx}",
"./node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
darkMode: "class",
plugins: [heroui()],
};

View File

@@ -0,0 +1,25 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"],
"references": [{ "path": "./tsconfig.node.json" }]
}

View File

@@ -0,0 +1,10 @@
{
"compilerOptions": {
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.ts"]
}

View File

@@ -0,0 +1,32 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
// @ts-expect-error process is a nodejs global
const host = process.env.TAURI_DEV_HOST;
// https://vitejs.dev/config/
export default defineConfig(async () => ({
plugins: [react()],
// Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
//
// 1. prevent vite from obscuring rust errors
clearScreen: false,
// 2. tauri expects a fixed port, fail if that port is not available
server: {
port: 1420,
strictPort: true,
host: host || false,
hmr: host
? {
protocol: "ws",
host,
port: 1421,
}
: undefined,
watch: {
// 3. tell vite to ignore watching `src-tauri`
ignored: ["**/src-tauri/**"],
},
},
}));