Imbus/FrostByte
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added a solid frontend

Browse source
This commit is contained in:
Imbus 2023-10-19 02:42:37 +02:00
parent 368909aefd
commit ad0dc74083
14 changed files with 2877 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
client-solid/.gitignore vendored Normal file
View file

@ -0,0 +1,24 @@
# 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?

17
client-solid/index.html Normal file
View file

@ -0,0 +1,17 @@
<!doctype html>
<html lang="en" data-theme="dracula">
<head>
<meta charset="UTF-8" />
<link rel="shortcut icon"
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-1756clo' focusable='false' aria-hidden='true' viewBox='0 0 24 24' data-testid='AcUnitIcon'%3E%3Cpath d='M22 11h-4.17l3.24-3.24-1.41-1.42L15 11h-2V9l4.66-4.66-1.42-1.41L13 6.17V2h-2v4.17L7.76 2.93 6.34 4.34 11 9v2H9L4.34 6.34 2.93 7.76 6.17 11H2v2h4.17l-3.24 3.24 1.41 1.42L9 13h2v2l-4.66 4.66 1.42 1.41L11 17.83V22h2v-4.17l3.24 3.24 1.42-1.41L13 15v-2h2l4.66 4.66 1.41-1.42L17.83 13H22z'%3E%3C/path%3E%3C/svg%3E" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>FrostByteSolid</title>
</head>
<body class="min-h-screen">
<div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body>
</html>

2547
client-solid/package-lock.json generated Normal file
View file

File diff suppressed because it is too large Load diff

25
client-solid/package.json Normal file
View file

@ -0,0 +1,25 @@
{
"name": "client-solid",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"@solidjs/router": "^0.8.3",
"solid-js": "^1.7.8"
},
"devDependencies": {
"autoprefixer": "^10.4.16",
"daisyui": "^3.9.3",
"postcss": "^8.4.31",
"tailwindcss": "^3.3.3",
"typescript": "^5.0.2",
"vite": "^4.4.5",
"vite-plugin-qrcode": "^0.2.2",
"vite-plugin-solid": "^2.7.0"
}
}

6
client-solid/postcss.config.js Normal file
View file

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

95
client-solid/src/Root.tsx Normal file
View file

@ -0,0 +1,95 @@
import { createSignal } from "solid-js";
import { createContext } from "solid-js";
import { createPost, getPosts, getPost } from "./api";
import { Post, NewPost } from "./api";
export const TestContext = createContext("Test123");
function Root() {
return (
<>
<TestContext.Provider value="Test123">
<Primary />
</TestContext.Provider>
</>
);
}
function Menu() {
return (
<ul class="menu menu-horizontal bg-base-200 rounded-box space-x-1">
<li>
<a>Home</a>
</li>
<li>
<a>Boards</a>
</li>
<li>
<a>New</a>
</li>
</ul>
);
}
function NewPostInputArea() {
const [content, setContent] = createSignal("");
return (
<div class="flex flex-col my-4">
<textarea
class="textarea textarea-bordered"
placeholder="Bio"
oninput={(input) => {
setContent(input.target.value);
}}
></textarea>
<button class="btn btn-primary self-end btn-sm mt-4" onclick={() => {
createPost({ content: content(), token: "" } as NewPost);
}}>Submit</button>
</div>
);
}
function Posts() {
const [posts, setPosts] = createSignal([]);
getPosts().then((posts) => {
setPosts(posts as any);
});
return (
<div class="flex flex-col my-4 space-y-2">
{posts().map((post) => {
return (
<PostSegment post={post}></PostSegment>
);
})}
</div>
);
}
function PostSegment({ post }: { post: Post}) {
return (
<div class="card bg-base-200 shadow-lg compact text-base-content">
<div class="card-body">
<h2 class="card-title">{post.content}</h2>
<p class="text-base-content">{post.uuid}</p>
<p>{post.votes.up}</p>
<p>{post.votes.down}</p>
</div>
</div>
);
}
function Primary() {
return (
<div class="flex flex-col items-center my-6">
<Menu></Menu>
<NewPostInputArea></NewPostInputArea>
<Posts></Posts>
</div>
);
}
export default Root;

43
client-solid/src/api.ts Normal file
View file

@ -0,0 +1,43 @@
const PORT = 3000;
const API_URL = `http://localhost:${PORT}/api/`;
const API_URL2 = new URL(API_URL);
export interface NewPost {
content: string;
token: string;
}
interface Votes {
up: number;
down: number;
}
export interface Post extends NewPost {
uuid: string;
createdAt: string;
votes: Votes;
}
export async function getPosts(): Promise<Post[]> {
// const res = await fetch(`${API_URL}/posts`);
const res = await fetch(API_URL2.href);
const data = await res.json();
return data;
}
export async function getPost(id: string): Promise<Post> {
const res = await fetch(`${API_URL}/posts/${id}`);
const data = await res.json();
return data;
}
export async function createPost(post: NewPost): Promise<void> {
// await fetch(`${API_URL}`, {
await fetch(API_URL2.href, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(post),
});
}

3
client-solid/src/index.css Normal file
View file

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

18
client-solid/src/index.tsx Normal file
View file

@ -0,0 +1,18 @@
/* @refresh reload */
import { render } from "solid-js/web";
import "./index.css";
import Root from "./Root";
import { Router } from "@solidjs/router";
const root = document.getElementById("root");
render(
() => (
<Router>
<Root />
</Router>
),
root!
);

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

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

31
client-solid/tailwind.config.js Normal file
View file

@ -0,0 +1,31 @@
/** @type {import('tailwindcss').Config} */
export default {
content: [
"./index.html",
"./src/**/*.{js,ts,jsx,tsx}",
],
daisyui: {
themes: [
{
mytheme: {
"primary": "#86e8d9",
"secondary": "#b5385d",
"accent": "#88ed5a",
"neutral": "#14171f",
"base-100": "#343154",
"info": "#9bc3e9",
"success": "#1f9363",
"warning": "#f2ce4a",
"error": "#e77d6a",
},
},
],
},
theme: {
extend: {},
},
plugins: [require("daisyui")],
}

34
client-solid/tsconfig.json Normal file
View file

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

10
client-solid/tsconfig.node.json Normal file
View file

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

23
client-solid/vite.config.ts Normal file
View file

@ -0,0 +1,23 @@
import { defineConfig } from 'vite'
import solid from 'vite-plugin-solid'
import { qrcode } from 'vite-plugin-qrcode'
// https://vitejs.dev/config/
export default defineConfig({
// build: {
// outDir: '../server/public' // Override default outDir('dist')
// },
plugins: [solid(), qrcode()],
server: {
port: 3000,
open: true,
proxy: {
'/api': {
target: 'http://localhost:8080/api',
changeOrigin: true,
secure: false,
rewrite: (path): string => path.replace(/^\/api/, '')
}
}
}
})