From 0a6d488836924d820f810efade5c28312e058d1e Mon Sep 17 00:00:00 2001 From: usbharu <64310155+usbharu@users.noreply.github.com> Date: Wed, 28 Jun 2023 18:36:38 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=E3=82=B5=E3=82=A4=E3=83=89=E3=83=90?= =?UTF-8?q?=E3=83=BC=E3=80=81=E3=83=AD=E3=82=B0=E3=82=A4=E3=83=B3=E3=83=95?= =?UTF-8?q?=E3=82=A9=E3=83=BC=E3=83=A0=E3=82=92=E4=BD=9C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 1 + package-lock.json | 247 +++++++++++++++++++++++++++ package.json | 2 + src/main/web/App.tsx | 30 ++-- src/main/web/atoms/SidebarButton.tsx | 14 ++ src/main/web/lib/ApiProvider.tsx | 8 + src/main/web/organisms/PostForm.tsx | 11 +- src/main/web/pages/LoginPage.tsx | 39 +++++ src/main/web/pages/TopPage.tsx | 14 +- src/main/web/templates/MainPage.tsx | 10 +- src/main/web/templates/PostList.tsx | 2 +- src/main/web/templates/Sidebar.tsx | 15 +- vite.config.ts | 10 +- 13 files changed, 369 insertions(+), 34 deletions(-) create mode 100644 src/main/web/atoms/SidebarButton.tsx create mode 100644 src/main/web/lib/ApiProvider.tsx create mode 100644 src/main/web/pages/LoginPage.tsx diff --git a/.gitignore b/.gitignore index a9f19f80..2165d593 100644 --- a/.gitignore +++ b/.gitignore @@ -38,3 +38,4 @@ out/ /src/main/resources/static/ /node_modules/ /src/main/web/generated/ +/stats.html diff --git a/package-lock.json b/package-lock.json index 819519ab..61f7805b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "hideout", "version": "1.0.0", "dependencies": { + "@solid-primitives/context": "^0.2.1", "@solid-primitives/storage": "^1.3.11", "@solidjs/router": "^0.8.2", "@suid/icons-material": "^0.6.3", @@ -17,6 +18,7 @@ "devDependencies": { "@openapitools/openapi-generator-cli": "^2.6.0", "@suid/vite-plugin": "^0.1.3", + "rollup-plugin-visualizer": "^5.9.2", "typescript": "^5.0.4", "vite": "^4.2.1", "vite-plugin-solid": "^2.7.0" @@ -1273,6 +1275,14 @@ "url": "https://opencollective.com/popperjs" } }, + "node_modules/@solid-primitives/context": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/@solid-primitives/context/-/context-0.2.1.tgz", + "integrity": "sha512-XIIwCOWpRKDersgkR9LNFXaJHIV8QlCFo/tq5bV0cAOZklcwOFcqi2bN+uWgEIQSWGjWXU2kc1H1/TzgYzVDlg==", + "peerDependencies": { + "solid-js": "^1.6.12" + } + }, "node_modules/@solid-primitives/storage": { "version": "1.3.11", "resolved": "https://registry.npmjs.org/@solid-primitives/storage/-/storage-1.3.11.tgz", @@ -1992,6 +2002,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/define-lazy-prop": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz", + "integrity": "sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==", + "dev": true, + "engines": { + "node": ">=8" + } + }, "node_modules/delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -2392,6 +2411,21 @@ "node": ">=8" } }, + "node_modules/is-docker": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz", + "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==", + "dev": true, + "bin": { + "is-docker": "cli.js" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/is-fullwidth-code-point": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", @@ -2434,6 +2468,18 @@ "url": "https://github.com/sponsors/mesqueeb" } }, + "node_modules/is-wsl": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz", + "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==", + "dev": true, + "dependencies": { + "is-docker": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/iterare": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/iterare/-/iterare-1.2.1.tgz", @@ -2723,6 +2769,23 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/open": { + "version": "8.4.2", + "resolved": "https://registry.npmjs.org/open/-/open-8.4.2.tgz", + "integrity": "sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==", + "dev": true, + "dependencies": { + "define-lazy-prop": "^2.0.0", + "is-docker": "^2.1.1", + "is-wsl": "^2.2.0" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/ora": { "version": "5.4.1", "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz", @@ -2846,6 +2909,18 @@ "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", "dev": true }, + "node_modules/picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true, + "engines": { + "node": ">=8.6" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, "node_modules/postcss": { "version": "8.4.24", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.24.tgz", @@ -2938,6 +3013,73 @@ "fsevents": "~2.3.2" } }, + "node_modules/rollup-plugin-visualizer": { + "version": "5.9.2", + "resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.9.2.tgz", + "integrity": "sha512-waHktD5mlWrYFrhOLbti4YgQCn1uR24nYsNuXxg7LkPH8KdTXVWR9DNY1WU0QqokyMixVXJS4J04HNrVTMP01A==", + "dev": true, + "dependencies": { + "open": "^8.4.0", + "picomatch": "^2.3.1", + "source-map": "^0.7.4", + "yargs": "^17.5.1" + }, + "bin": { + "rollup-plugin-visualizer": "dist/bin/cli.js" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "rollup": "2.x || 3.x" + }, + "peerDependenciesMeta": { + "rollup": { + "optional": true + } + } + }, + "node_modules/rollup-plugin-visualizer/node_modules/cliui": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz", + "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==", + "dev": true, + "dependencies": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.1", + "wrap-ansi": "^7.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/rollup-plugin-visualizer/node_modules/yargs": { + "version": "17.7.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz", + "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==", + "dev": true, + "dependencies": { + "cliui": "^8.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "require-directory": "^2.1.1", + "string-width": "^4.2.3", + "y18n": "^5.0.5", + "yargs-parser": "^21.1.1" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/rollup-plugin-visualizer/node_modules/yargs-parser": { + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", + "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", + "dev": true, + "engines": { + "node": ">=12" + } + }, "node_modules/run-async": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz", @@ -3034,6 +3176,15 @@ "solid-js": "^1.3" } }, + "node_modules/source-map": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz", + "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, "node_modules/source-map-js": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", @@ -4227,6 +4378,12 @@ "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==" }, + "@solid-primitives/context": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/@solid-primitives/context/-/context-0.2.1.tgz", + "integrity": "sha512-XIIwCOWpRKDersgkR9LNFXaJHIV8QlCFo/tq5bV0cAOZklcwOFcqi2bN+uWgEIQSWGjWXU2kc1H1/TzgYzVDlg==", + "requires": {} + }, "@solid-primitives/storage": { "version": "1.3.11", "resolved": "https://registry.npmjs.org/@solid-primitives/storage/-/storage-1.3.11.tgz", @@ -4759,6 +4916,12 @@ "clone": "^1.0.2" } }, + "define-lazy-prop": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz", + "integrity": "sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==", + "dev": true + }, "delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -5050,6 +5213,12 @@ } } }, + "is-docker": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz", + "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==", + "dev": true + }, "is-fullwidth-code-point": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", @@ -5074,6 +5243,15 @@ "integrity": "sha512-yq8gMao5upkPoGEU9LsB2P+K3Kt8Q3fQFCGyNCWOAnJAMzEXVV9drYb0TXr42TTliLLhKIBvulgAXgtLLnwzGA==", "dev": true }, + "is-wsl": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz", + "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==", + "dev": true, + "requires": { + "is-docker": "^2.0.0" + } + }, "iterare": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/iterare/-/iterare-1.2.1.tgz", @@ -5274,6 +5452,17 @@ "mimic-fn": "^2.1.0" } }, + "open": { + "version": "8.4.2", + "resolved": "https://registry.npmjs.org/open/-/open-8.4.2.tgz", + "integrity": "sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==", + "dev": true, + "requires": { + "define-lazy-prop": "^2.0.0", + "is-docker": "^2.1.1", + "is-wsl": "^2.2.0" + } + }, "ora": { "version": "5.4.1", "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz", @@ -5366,6 +5555,12 @@ "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", "dev": true }, + "picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true + }, "postcss": { "version": "8.4.24", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.24.tgz", @@ -5425,6 +5620,52 @@ "fsevents": "~2.3.2" } }, + "rollup-plugin-visualizer": { + "version": "5.9.2", + "resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.9.2.tgz", + "integrity": "sha512-waHktD5mlWrYFrhOLbti4YgQCn1uR24nYsNuXxg7LkPH8KdTXVWR9DNY1WU0QqokyMixVXJS4J04HNrVTMP01A==", + "dev": true, + "requires": { + "open": "^8.4.0", + "picomatch": "^2.3.1", + "source-map": "^0.7.4", + "yargs": "^17.5.1" + }, + "dependencies": { + "cliui": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz", + "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==", + "dev": true, + "requires": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.1", + "wrap-ansi": "^7.0.0" + } + }, + "yargs": { + "version": "17.7.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz", + "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==", + "dev": true, + "requires": { + "cliui": "^8.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "require-directory": "^2.1.1", + "string-width": "^4.2.3", + "y18n": "^5.0.5", + "yargs-parser": "^21.1.1" + } + }, + "yargs-parser": { + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", + "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", + "dev": true + } + } + }, "run-async": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz", @@ -5497,6 +5738,12 @@ "@babel/types": "^7.21.2" } }, + "source-map": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz", + "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==", + "dev": true + }, "source-map-js": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", diff --git a/package.json b/package.json index 0ce430cc..2425b705 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,7 @@ "name": "hideout", "version": "1.0.0", "dependencies": { + "@solid-primitives/context": "^0.2.1", "@solid-primitives/storage": "^1.3.11", "@solidjs/router": "^0.8.2", "@suid/icons-material": "^0.6.3", @@ -11,6 +12,7 @@ "devDependencies": { "@openapitools/openapi-generator-cli": "^2.6.0", "@suid/vite-plugin": "^0.1.3", + "rollup-plugin-visualizer": "^5.9.2", "typescript": "^5.0.4", "vite": "^4.2.1", "vite-plugin-solid": "^2.7.0" diff --git a/src/main/web/App.tsx b/src/main/web/App.tsx index 5f95a4dc..7e925695 100644 --- a/src/main/web/App.tsx +++ b/src/main/web/App.tsx @@ -1,24 +1,32 @@ -import {Component} from "solid-js"; +import {Component, createSignal, lazy} from "solid-js"; import {Route, Router, Routes} from "@solidjs/router"; import {TopPage} from "./pages/TopPage"; import {createTheme, CssBaseline, ThemeProvider, useMediaQuery} from "@suid/material"; +import {createCookieStorage} from "@solid-primitives/storage"; +import {ApiProvider, useApi} from "./lib/ApiProvider"; +import {Configuration, DefaultApi} from "./generated"; +import {LoginPage} from "./pages/LoginPage"; export const App: Component = () => { const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)'); - + const [cookie,setCookie] = createCookieStorage() + const [api,setApi] = createSignal(new DefaultApi(new Configuration({basePath:window.location.origin+"/api/internal/v1/",apiKey:cookie.key as string}))) const theme = createTheme({ palette: { mode: prefersDarkMode() ? 'dark' : 'light', } }) return ( - - - - - - - - + + + + + + + + + + + ) -} \ No newline at end of file +} diff --git a/src/main/web/atoms/SidebarButton.tsx b/src/main/web/atoms/SidebarButton.tsx new file mode 100644 index 00000000..cfce597a --- /dev/null +++ b/src/main/web/atoms/SidebarButton.tsx @@ -0,0 +1,14 @@ +import {ParentComponent} from "solid-js"; +import {Button, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText} from "@suid/material"; +import {Link} from "@solidjs/router"; + +export const SidebarButton: ParentComponent<{ text: string,linkTo:string }> = (props) => { + return ( + + + {props.children} + + + + ) +} diff --git a/src/main/web/lib/ApiProvider.tsx b/src/main/web/lib/ApiProvider.tsx new file mode 100644 index 00000000..006f9897 --- /dev/null +++ b/src/main/web/lib/ApiProvider.tsx @@ -0,0 +1,8 @@ +import {createContextProvider} from "@solid-primitives/context"; +import {createSignal} from "solid-js"; +import {DefaultApi, DefaultApiInterface} from "../generated"; + +export const [ApiProvider,useApi] = createContextProvider((props:{api:DefaultApiInterface}) => { + const [api,setApi] = createSignal(props.api); + return api +},()=>new DefaultApi()); diff --git a/src/main/web/organisms/PostForm.tsx b/src/main/web/organisms/PostForm.tsx index 4a89fa80..3d11515a 100644 --- a/src/main/web/organisms/PostForm.tsx +++ b/src/main/web/organisms/PostForm.tsx @@ -1,15 +1,18 @@ -import {Component} from "solid-js"; +import {Component, createSignal} from "solid-js"; import {Button, IconButton, Paper, Stack, TextField, Typography} from "@suid/material"; import {Avatar} from "../atoms/Avatar"; import {AddPhotoAlternate, Poll, Public} from "@suid/icons-material"; +import {useApi} from "../lib/ApiProvider"; export const PostForm: Component<{ label: string }> = (props) => { + const [text, setText] = createSignal("") + const api = useApi() return ( - + setText(event.target.value)} fullWidth/> @@ -27,7 +30,9 @@ export const PostForm: Component<{ label: string }> = (props) => { aaa - diff --git a/src/main/web/pages/LoginPage.tsx b/src/main/web/pages/LoginPage.tsx new file mode 100644 index 00000000..d5ccc4f1 --- /dev/null +++ b/src/main/web/pages/LoginPage.tsx @@ -0,0 +1,39 @@ +import {Button, Card, CardContent, CardHeader, Modal, Stack, TextField} from "@suid/material"; +import {Component, createSignal} from "solid-js"; + +export const LoginPage:Component = () => { + const [username,setUsername] = createSignal("") + const [password,setPassword] = createSignal("") + + return ( + + + + + + + + setUsername(event.target.value)} + label="Username" + type="text" + autoComplete="username" + variant="standard" + /> + setPassword(event.target.value)} + label="Password" + type="password" + autoComplete="current-password" + variant="standard" + /> + + + + + + ) +} diff --git a/src/main/web/pages/TopPage.tsx b/src/main/web/pages/TopPage.tsx index 95cf9983..b62c2665 100644 --- a/src/main/web/pages/TopPage.tsx +++ b/src/main/web/pages/TopPage.tsx @@ -1,21 +1,23 @@ -import {Component, createResource} from "solid-js"; +import {Component} from "solid-js"; import {MainPage} from "../templates/MainPage"; import {PostForm} from "../organisms/PostForm"; import {Stack} from "@suid/material"; -import {DefaultApi} from "../generated"; +import {PostResponse} from "../generated"; import {PostList} from "../templates/PostList"; -import {ApiWrapper} from "../lib/ApiWrapper"; +import {useApi} from "../lib/ApiProvider"; +import {createStore} from "solid-js/store"; export const TopPage: Component = () => { - const api = new ApiWrapper(new DefaultApi()) - const [posts] = createResource(api.postsGet); + const api = useApi() + const [posts, setPosts] = createStore([]) + api().postsGet().then((res)=>setPosts(res)) return ( - + ) diff --git a/src/main/web/templates/MainPage.tsx b/src/main/web/templates/MainPage.tsx index a4c9b4d0..cf183a8e 100644 --- a/src/main/web/templates/MainPage.tsx +++ b/src/main/web/templates/MainPage.tsx @@ -1,20 +1,20 @@ -import {ParentComponent} from "solid-js"; +import {createSignal, ParentComponent} from "solid-js"; import {Grid} from "@suid/material"; import {Sidebar} from "./Sidebar"; export const MainPage: ParentComponent = (props) => { - return ( - + - + {props.children} + ) -} \ No newline at end of file +} diff --git a/src/main/web/templates/PostList.tsx b/src/main/web/templates/PostList.tsx index f8f4fc1e..82930d8e 100644 --- a/src/main/web/templates/PostList.tsx +++ b/src/main/web/templates/PostList.tsx @@ -3,7 +3,7 @@ import {CircularProgress} from "@suid/material"; import {Post} from "../organisms/Post"; import {PostResponse} from "../generated"; -export const PostList: Component<{ posts: PostResponse[] }> = (props) => { +export const PostList: Component<{ posts: PostResponse[] | undefined }> = (props) => { return ( }> { diff --git a/src/main/web/templates/Sidebar.tsx b/src/main/web/templates/Sidebar.tsx index 663d7c07..cf8d16de 100644 --- a/src/main/web/templates/Sidebar.tsx +++ b/src/main/web/templates/Sidebar.tsx @@ -1,10 +1,13 @@ import {Component} from "solid-js"; -import {Stack} from "@suid/material"; +import {Button, List, Stack} from "@suid/material"; +import {Home} from "@suid/icons-material"; +import {SidebarButton} from "../atoms/SidebarButton"; -export const Sidebar: Component = () => { +export const Sidebar: Component = (props) => { return ( - - - + + + + ) -} \ No newline at end of file +} diff --git a/vite.config.ts b/vite.config.ts index e0e384eb..bf6b9be6 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,9 +1,10 @@ -import {defineConfig} from 'vite'; +import {defineConfig, splitVendorChunkPlugin} from 'vite'; import solidPlugin from 'vite-plugin-solid'; import suidPlugin from "@suid/vite-plugin"; +import visualizer from "rollup-plugin-visualizer"; export default defineConfig({ - plugins: [solidPlugin(),suidPlugin()], + plugins: [solidPlugin(),suidPlugin(),splitVendorChunkPlugin()], server: { port: 3000, proxy: { @@ -14,5 +15,10 @@ export default defineConfig({ build: { target: 'esnext', outDir: '../resources/static', + rollupOptions:{ + plugins: [ + visualizer() + ] + } }, });