diff --git a/bun.lockb b/bun.lockb index 698a5d6..f84d234 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/package.json b/package.json index d0641dc..cb5a4ce 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "remark-gfm": "^4.0.0", "remark-parse": "^11.0.0", "remark-rehype": "^11.1.1", - "solar-js-sdk": "^0.1.2", + "solar-js-sdk": "^0.1.3", "unified": "^11.0.5", "unzipper": "^0.12.3" }, diff --git a/src/main/library.ts b/src/main/library.ts index 54d7b78..d1db2cf 100644 --- a/src/main/library.ts +++ b/src/main/library.ts @@ -2,6 +2,7 @@ import { ipcMain, app } from 'electron' import { MaProduct, MaRelease } from 'solar-js-sdk' import { join } from 'path' import * as fs from 'fs' +import { spawn } from 'child_process' export interface AppLibrary { apps: LocalAppRecord[] @@ -38,7 +39,12 @@ export interface LocalAppRecord { export function initLibrary(): void { readLocalLibrary() - ipcMain.handle('get-app-library', () => getAppLibrary()) + ipcMain.handle('get-app-library', () => JSON.stringify(getAppLibrary())) + ipcMain.handle('get-app-library-one', (_, id: string) => + JSON.stringify(getAppLibrary().filter((ele) => ele.id === id)[0]), + ) + + ipcMain.handle('launch-app', (_, id: string) => launchApp(id)) } export function getAppLibrary(): LocalAppRecord[] { @@ -61,3 +67,22 @@ export function setAppRecord(record: LocalAppRecord) { library.apps = current saveLocalLibrary() } + +export function launchApp(id: string): void { + const app = getAppLibrary().filter((ele) => ele.id === id)[0] + if (!app) return + + const platform = process.platform + const runner = app.release.runners[platform] + + const segments = runner.script.split(' ') + + try { + spawn(segments[0], segments.slice(1), { + detached: true, + cwd: runner.workdir ? join(app.basePath, runner.workdir) : app.basePath, + }) + } catch (err: any) { + console.error(err) + } +} diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx index f3a633b..aaeab8c 100644 --- a/src/renderer/src/App.tsx +++ b/src/renderer/src/App.tsx @@ -8,6 +8,8 @@ import { useEffect } from 'react' import ProductDetails from './pages/products/Details' import Tasks from './pages/Tasks' +import Library from './pages/Library' +import LibraryDetails from './pages/library/Details' function App(): JSX.Element { const userStore = useUserStore() @@ -42,7 +44,9 @@ function App(): JSX.Element { } /> } /> + } /> } /> + } /> diff --git a/src/renderer/src/components/MaInstallDialog.tsx b/src/renderer/src/components/MaInstallDialog.tsx index 5f5f34a..4f0a5a4 100644 --- a/src/renderer/src/components/MaInstallDialog.tsx +++ b/src/renderer/src/components/MaInstallDialog.tsx @@ -11,14 +11,9 @@ import { } from '@mui/material' import { useEffect, useState } from 'react' import { MaProduct, MaRelease } from 'solar-js-sdk' -import { unified } from 'unified' -import rehypeSanitize from 'rehype-sanitize' -import rehypeStringify from 'rehype-stringify' -import remarkGfm from 'remark-gfm' -import remarkParse from 'remark-parse' -import remarkRehype from 'remark-rehype' import { InstallTask } from '@main/tasks' import { useNavigate } from 'react-router' +import { parseContent } from '@renderer/services/parser' export function MaInstallDialog({ release, @@ -35,23 +30,6 @@ export function MaInstallDialog({ const [installPath, setInstallPath] = useState() - async function parseContent(content: string): Promise { - content = content.replace( - /!\[.*?\]\(solink:\/\/attachments\/([\w-]+)\)/g, - '![alt](https://api.sn.solsynth.dev/cgi/uc/attachments/$1)', - ) - - const out = await unified() - .use(remarkParse) - .use(remarkRehype) - .use(remarkGfm) - .use(rehypeSanitize) - .use(rehypeStringify) - .process(content) - - return String(out) - } - useEffect(() => { if (release == null) return parseContent(release.meta.content).then((out) => setContent(out)) diff --git a/src/renderer/src/pages/Landing.tsx b/src/renderer/src/pages/Landing.tsx index ff9cb14..02d11a6 100644 --- a/src/renderer/src/pages/Landing.tsx +++ b/src/renderer/src/pages/Landing.tsx @@ -32,7 +32,7 @@ export default function Landing(): JSX.Element { }, []) return ( - + Matrix Marketplace diff --git a/src/renderer/src/pages/Library.tsx b/src/renderer/src/pages/Library.tsx new file mode 100644 index 0000000..505cb5e --- /dev/null +++ b/src/renderer/src/pages/Library.tsx @@ -0,0 +1,84 @@ +import { LocalAppRecord } from '@main/library' +import { + Avatar, + Card, + CardActionArea, + CardContent, + CardMedia, + Container, + Grid2 as Grid, + Typography, +} from '@mui/material' +import { useEffect, useState } from 'react' +import { useNavigate } from 'react-router' +import { getAttachmentUrl } from 'solar-js-sdk' + +export default function Library(): JSX.Element { + const navigate = useNavigate() + + const [apps, setApps] = useState([]) + + function fetchApps() { + window.electron.ipcRenderer.invoke('get-app-library').then((res) => setApps(JSON.parse(res))) + } + + useEffect(() => { + fetchApps() + }, []) + + return ( + + + Library + + + + {apps.map((p) => ( + + + navigate('/library/' + p.id)}> + {p.product.previews && ( + + )} + + {p.product.icon && ( + + )} + + {p.product.name} + + + {p.product.description} + + + + Installed + + + {p.release.meta.title} {p.release.version} + + + + + + ))} + + + ) +} diff --git a/src/renderer/src/pages/library/Details.tsx b/src/renderer/src/pages/library/Details.tsx new file mode 100644 index 0000000..a548e1d --- /dev/null +++ b/src/renderer/src/pages/library/Details.tsx @@ -0,0 +1,109 @@ +import { LocalAppRecord } from '@main/library' +import { Avatar, Box, Button, Container, Grid2 as Grid, IconButton, Stack, Typography } from '@mui/material' +import { useEffect, useMemo, useState } from 'react' +import { useNavigate, useParams } from 'react-router' +import { getAttachmentUrl } from 'solar-js-sdk' +import { parseContent } from '@renderer/services/parser' + +import PlayIcon from '@mui/icons-material/PlayArrow' +import ArrowBackwardIcon from '@mui/icons-material/ArrowBack' + +export default function LibraryDetails(): JSX.Element { + const { id } = useParams() + const navigate = useNavigate() + + const [app, setApp] = useState() + const [appProductContent, setAppProductContent] = useState() + const [appReleaseContent, setAppReleaseContent] = useState() + + const product = useMemo(() => app?.product, [app]) + + function fetchApp() { + window.electron.ipcRenderer.invoke('get-app-library-one', id).then((res) => { + const app = JSON.parse(res) + if (app == null) { + navigate('/library') + return + } + return setApp(app) + }) + } + + useEffect(() => { + fetchApp() + }, []) + + useEffect(() => { + if (app) { + parseContent(app.product.meta.introduction).then((out) => setAppProductContent(out)) + parseContent(app.release.meta.content).then((out) => setAppReleaseContent(out)) + } + }, [app]) + + function launchApp() { + window.electron.ipcRenderer.invoke('launch-app', app?.id) + } + + return ( + <> + {product?.previews && ( + + )} + + + + + + + + + + {product?.icon && ( + + )} + + {product?.name} + + + {product?.description} + + + + {appProductContent && ( + + )} + + + + + + + + + + + + + + + ) +} diff --git a/src/renderer/src/pages/products/Details.tsx b/src/renderer/src/pages/products/Details.tsx index 44a3ed7..98272bd 100644 --- a/src/renderer/src/pages/products/Details.tsx +++ b/src/renderer/src/pages/products/Details.tsx @@ -16,15 +16,10 @@ import { useEffect, useState } from 'react' import { useNavigate, useParams } from 'react-router' import { MaInstallDialog } from '@renderer/components/MaInstallDialog' import { getAttachmentUrl, MaProduct, MaRelease, sni } from 'solar-js-sdk' -import { unified } from 'unified' -import rehypeSanitize from 'rehype-sanitize' -import rehypeStringify from 'rehype-stringify' -import remarkGfm from 'remark-gfm' -import remarkParse from 'remark-parse' -import remarkRehype from 'remark-rehype' import DownloadIcon from '@mui/icons-material/Download' import ArrowBackwardIcon from '@mui/icons-material/ArrowBack' +import { parseContent } from '@renderer/services/parser' export default function ProductDetails(): JSX.Element { const { id } = useParams() @@ -38,23 +33,6 @@ export default function ProductDetails(): JSX.Element { setProduct(data) } - async function parseContent(content: string): Promise { - content = content.replace( - /!\[.*?\]\(solink:\/\/attachments\/([\w-]+)\)/g, - '![alt](https://api.sn.solsynth.dev/cgi/uc/attachments/$1)', - ) - - const out = await unified() - .use(remarkParse) - .use(remarkRehype) - .use(remarkGfm) - .use(rehypeSanitize) - .use(rehypeStringify) - .process(content) - - return String(out) - } - const [releases, setReleases] = useState() const [selectedRelease, setSelectedRelease] = useState() diff --git a/src/renderer/src/services/parser.ts b/src/renderer/src/services/parser.ts new file mode 100644 index 0000000..d33fb8d --- /dev/null +++ b/src/renderer/src/services/parser.ts @@ -0,0 +1,23 @@ +import { unified } from 'unified' +import rehypeSanitize from 'rehype-sanitize' +import rehypeStringify from 'rehype-stringify' +import remarkGfm from 'remark-gfm' +import remarkParse from 'remark-parse' +import remarkRehype from 'remark-rehype' + +export async function parseContent(content: string): Promise { + content = content.replace( + /!\[.*?\]\(solink:\/\/attachments\/([\w-]+)\)/g, + '![alt](https://api.sn.solsynth.dev/cgi/uc/attachments/$1)', + ) + + const out = await unified() + .use(remarkParse) + .use(remarkRehype) + .use(remarkGfm) + .use(rehypeSanitize) + .use(rehypeStringify) + .process(content) + + return String(out) +}