diff --git a/package-lock.json b/package-lock.json index bb88d1d..7e99599 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1740,7 +1740,6 @@ "integrity": "sha512-fYDQA9e6yTNmA13TLVSA+WMQRc5Bn/c0EUBditUHNfMMxN7M82c38b1kEggVE3pLpZ0FwkwJkUEKMiOi52JXFA==", "dev": true, "license": "Apache-2.0", - "peer": true, "dependencies": { "@babel/generator": "^7.26.5", "@babel/parser": "^7.26.7", @@ -1811,7 +1810,6 @@ "integrity": "sha512-qzQZRBqkFsYyaSWXuEHc2WR9c0a0CXwiE5FWUvn7ZM+vdy1uZLfCunD38UzhuB7YN/J11ndbDBcTmOdxJo9Q7A==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "undici-types": "~7.16.0" } @@ -1820,7 +1818,8 @@ "version": "1.26.5", "resolved": "https://registry.npmjs.org/@types/prismjs/-/prismjs-1.26.5.tgz", "integrity": "sha512-AUZTa7hQ2KY5L7AmtSiqxlhWxb4ina0yd8hNbl4TWuqnv/pFP0nDMb3YrfSBf4hJVGLh2YEIBfKaBW/9UEl6IQ==", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/@types/react": { "version": "19.2.2", @@ -1828,7 +1827,6 @@ "integrity": "sha512-6mDvHUFSjyT2B2yeNx2nUgMxh9LtOWvkhIU3uePn2I2oyNymUAX1NIsdgviM4CH+JSrp2D2hsMvJOkxY+0wNRA==", "devOptional": true, "license": "MIT", - "peer": true, "dependencies": { "csstype": "^3.0.2" } @@ -1839,7 +1837,6 @@ "integrity": "sha512-9KQPoO6mZCi7jcIStSnlOWn2nEF3mNmyr3rIAsGnAbQKYbRLyqmeSc39EVgtxXVia+LMT8j3knZLAZAh+xLmrw==", "devOptional": true, "license": "MIT", - "peer": true, "peerDependencies": { "@types/react": "^19.2.0" } @@ -3291,7 +3288,6 @@ "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -3334,7 +3330,6 @@ "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==", "dev": true, "license": "MIT", - "peer": true, "bin": { "prettier": "bin/prettier.cjs" }, @@ -3443,7 +3438,6 @@ "resolved": "https://registry.npmjs.org/react/-/react-19.2.0.tgz", "integrity": "sha512-tmbWg6W31tQLeB5cdIBOicJDJRR2KzXsV7uSK9iNfLWQ5bIZfxuPEHp7M8wiHyHnn0DD1i7w3Zmin0FtkrwoCQ==", "license": "MIT", - "peer": true, "engines": { "node": ">=0.10.0" } @@ -3464,7 +3458,6 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.0.tgz", "integrity": "sha512-UlbRu4cAiGaIewkPyiRGJk0imDN2T3JjieT6spoL2UeSf5od4n5LB/mQ4ejmxhCFT1tYe8IvaFulzynWovsEFQ==", "license": "MIT", - "peer": true, "dependencies": { "scheduler": "^0.27.0" }, @@ -3825,7 +3818,6 @@ "integrity": "sha512-J1QRxf8zlYNvjAY1fB6zW+FLr0K26/IpKFrGM+Za0Ko6meJUMlHBk+LV19gAb8sfSluH4/6dyWKVS2dvNU4RLQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@oxc-project/runtime": "0.96.0", "fdir": "^6.5.0", diff --git a/src/app/auto-splitters.tsx b/src/app/auto-splitters.tsx new file mode 100644 index 0000000..48ba9f9 --- /dev/null +++ b/src/app/auto-splitters.tsx @@ -0,0 +1,9 @@ +import { AppGitHubAutoSplitters } from "@/components/libresplit/AppGitHubAutoSplitters"; + +export function AutoSplitters() { + return ( +
+ +
+ ); +} diff --git a/src/app/settings-keybinds.tsx b/src/app/settings-keybinds.tsx new file mode 100644 index 0000000..7838a80 --- /dev/null +++ b/src/app/settings-keybinds.tsx @@ -0,0 +1,9 @@ +import { AppGitHubSettingsKeybinds } from "@/components/libresplit/AppGitHubSettingsKeybinds"; + +export function SettingsKeybinds() { + return ( +
+ +
+ ); +} diff --git a/src/app/split-files.tsx b/src/app/split-files.tsx new file mode 100644 index 0000000..a92dbbd --- /dev/null +++ b/src/app/split-files.tsx @@ -0,0 +1,9 @@ +import { AppGitHubSplitFiles } from "@/components/libresplit/AppGitHubSplitFiles"; + +export function SplitFiles() { + return ( +
+ +
+ ); +} diff --git a/src/app/themes.tsx b/src/app/themes.tsx new file mode 100644 index 0000000..aa7b29a --- /dev/null +++ b/src/app/themes.tsx @@ -0,0 +1,9 @@ +import { AppGitHubThemes } from "@/components/libresplit/AppGitHubThemes"; + +export function Themes() { + return ( +
+ +
+ ); +} diff --git a/src/app/troubleshooting.tsx b/src/app/troubleshooting.tsx new file mode 100644 index 0000000..f4c5e63 --- /dev/null +++ b/src/app/troubleshooting.tsx @@ -0,0 +1,9 @@ +import { AppGitHubTroubleshooting } from "@/components/libresplit/AppGitHubTroubleshooting"; + +export function Troubleshooting() { + return ( +
+ +
+ ); +} diff --git a/src/components/libresplit/AppGitHubAutoSplitters.tsx b/src/components/libresplit/AppGitHubAutoSplitters.tsx new file mode 100644 index 0000000..64105c3 --- /dev/null +++ b/src/components/libresplit/AppGitHubAutoSplitters.tsx @@ -0,0 +1,34 @@ +import { useEffect, useState } from "react"; + +import { AppLoading } from "./AppLoading"; +import { Markdown } from "@/lib/markdown"; + +export function AppGitHubAutoSplitters() { + const [autoSplitters, setAutoSplitters] = useState("Loading..."); + const [isLoading, setIsLoading] = useState(true); + + const urlAutoSplitters = + "https://raw.githubusercontent.com/LibreSplit/LibreSplit/refs/heads/main/docs/auto-splitters.md"; + + // Fetch markdown from GitHub page for LibreSplit, place into the readme state. + useEffect(() => { + fetch(urlAutoSplitters) + .then((res) => { + if (!res.ok) throw new Error(`HTTP Error! Status: ${res.status}`); + return res.text(); + }) + .then((text) => setAutoSplitters(text)) + .catch(() => setAutoSplitters("Failed to load README from GitHub.")) + .finally(() => setIsLoading(false)); + }, []); + + if (isLoading) { + return ; + } + + return ( +
+ +
+ ); +} diff --git a/src/components/libresplit/AppGitHubSettingsKeybinds.tsx b/src/components/libresplit/AppGitHubSettingsKeybinds.tsx new file mode 100644 index 0000000..d8d1afd --- /dev/null +++ b/src/components/libresplit/AppGitHubSettingsKeybinds.tsx @@ -0,0 +1,35 @@ +import { useEffect, useState } from "react"; + +import { AppLoading } from "./AppLoading"; +import { Markdown } from "@/lib/markdown"; + +export function AppGitHubSettingsKeybinds() { + const [settingsKeybinds, setSettingsKeybinds] = + useState("Loading..."); + const [isLoading, setIsLoading] = useState(true); + + const urlSettingsKeybinds = + "https://raw.githubusercontent.com/LibreSplit/LibreSplit/refs/heads/main/docs/settings-keybinds.md"; + + // Fetch markdown from GitHub page for LibreSplit, place into the readme state. + useEffect(() => { + fetch(urlSettingsKeybinds) + .then((res) => { + if (!res.ok) throw new Error(`HTTP Error! Status: ${res.status}`); + return res.text(); + }) + .then((text) => setSettingsKeybinds(text)) + .catch(() => setSettingsKeybinds("Failed to load README from GitHub.")) + .finally(() => setIsLoading(false)); + }, []); + + if (isLoading) { + return ; + } + + return ( +
+ +
+ ); +} diff --git a/src/components/libresplit/AppGitHubSplitFiles.tsx b/src/components/libresplit/AppGitHubSplitFiles.tsx new file mode 100644 index 0000000..722860c --- /dev/null +++ b/src/components/libresplit/AppGitHubSplitFiles.tsx @@ -0,0 +1,33 @@ +import { useEffect, useState } from "react"; + +import { AppLoading } from "./AppLoading"; +import { Markdown } from "@/lib/markdown"; + +export function AppGitHubSplitFiles() { + const [splitFiles, setSplitFiles] = useState("Loading..."); + const [isLoading, setIsLoading] = useState(true); + + const urlSplitFiles = + "https://raw.githubusercontent.com/LibreSplit/LibreSplit/refs/heads/main/docs/split-files.md"; + + useEffect(() => { + fetch(urlSplitFiles) + .then((res) => { + if (!res.ok) throw new Error(`HTTP Error! Status: ${res.status}`); + return res.text(); + }) + .then((text) => setSplitFiles(text)) + .catch(() => setSplitFiles("Failed to load README from GitHub.")) + .finally(() => setIsLoading(false)); + }, []); + + if (isLoading) { + return ; + } + + return ( +
+ +
+ ); +} diff --git a/src/components/libresplit/AppGitHubThemes.tsx b/src/components/libresplit/AppGitHubThemes.tsx new file mode 100644 index 0000000..5ac91fe --- /dev/null +++ b/src/components/libresplit/AppGitHubThemes.tsx @@ -0,0 +1,33 @@ +import { useEffect, useState } from "react"; + +import { AppLoading } from "./AppLoading"; +import { Markdown } from "@/lib/markdown"; + +export function AppGitHubThemes() { + const [themes, setThemes] = useState("Loading..."); + const [isLoading, setIsLoading] = useState(true); + + const urlThemes = + "https://raw.githubusercontent.com/LibreSplit/LibreSplit/refs/heads/main/docs/themes.md"; + + useEffect(() => { + fetch(urlThemes) + .then((res) => { + if (!res.ok) throw new Error(`HTTP Error! Status: ${res.status}`); + return res.text(); + }) + .then((text) => setThemes(text)) + .catch(() => setThemes("Failed to load README from GitHub.")) + .finally(() => setIsLoading(false)); + }, []); + + if (isLoading) { + return ; + } + + return ( +
+ +
+ ); +} diff --git a/src/components/libresplit/AppGitHubTroubleshooting.tsx b/src/components/libresplit/AppGitHubTroubleshooting.tsx new file mode 100644 index 0000000..78cba13 --- /dev/null +++ b/src/components/libresplit/AppGitHubTroubleshooting.tsx @@ -0,0 +1,33 @@ +import { useEffect, useState } from "react"; + +import { AppLoading } from "./AppLoading"; +import { Markdown } from "@/lib/markdown"; + +export function AppGitHubTroubleshooting() { + const [troubleshooting, setTroubleshooting] = useState("Loading..."); + const [isLoading, setIsLoading] = useState(true); + + const urlTroubleshooting = + "https://raw.githubusercontent.com/LibreSplit/LibreSplit/refs/heads/main/docs/troubleshooting.md"; + + useEffect(() => { + fetch(urlTroubleshooting) + .then((res) => { + if (!res.ok) throw new Error(`HTTP Error! Status: ${res.status}`); + return res.text(); + }) + .then((text) => setTroubleshooting(text)) + .catch(() => setTroubleshooting("Failed to load README from GitHub.")) + .finally(() => setIsLoading(false)); + }, []); + + if (isLoading) { + return ; + } + + return ( +
+ +
+ ); +} diff --git a/src/router.tsx b/src/router.tsx index fcf97aa..de96288 100644 --- a/src/router.tsx +++ b/src/router.tsx @@ -1,6 +1,11 @@ +import { AutoSplitters } from "./app/auto-splitters"; import { Converter } from "./app/converter"; import { Home } from "./app/home"; import { NotFound } from "./app/not-found"; +import { SettingsKeybinds } from "./app/settings-keybinds"; +import { Themes } from "./app/themes"; +import { Troubleshooting } from "./app/troubleshooting"; +import { AppGitHubSplitFiles } from "./components/libresplit/AppGitHubSplitFiles"; import { Route, Routes } from "react-router"; export default function AppRouter() { @@ -9,6 +14,13 @@ export default function AppRouter() { } /> } /> + {/* Documentation Pages */} + } /> + } /> + } /> + } /> + } /> + {/* Fall back on app's 404 page. This is because of the SPA routing trick with 404.html used in GitHub Pages. */} } /> diff --git a/vite.config.ts b/vite.config.ts index 4ea20f7..5c8d2c1 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -13,7 +13,14 @@ export default defineConfig({ copyIndexTo404(), sitemap({ hostname: "https://libresplit.org", - dynamicRoutes: ["/converter"], + dynamicRoutes: [ + "/converter", + "/docs/auto-splitters.md", + "/docs/settings-keybinds.md", + "/docs/split-files.md", + "/docs/themes.md", + "/docs/troubleshooting.md", + ], exclude: ["/404"], }), ],