From b4dba4d5bb09b6f403e416247f8c7eacd381267f Mon Sep 17 00:00:00 2001 From: MotorTruck1221 Date: Wed, 17 Apr 2024 08:56:15 -0600 Subject: [PATCH 1/2] In the wise words of @riftriot 'GUH' --- src/pages/Home.tsx | 2 +- src/routes.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index d290f2b..a3c38d3 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -20,7 +20,7 @@ export function Home() { const firstLoad = localStorage.getItem("firstLoad") || "true"; console.log(firstLoad); //make sure service workers are updated - updateServiceWorkers(); + //updateServiceWorkers(); //make sure transport is set //setTransport(); if (firstLoad == "true" && prod) { diff --git a/src/routes.tsx b/src/routes.tsx index 2d2324b..5a75f28 100644 --- a/src/routes.tsx +++ b/src/routes.tsx @@ -24,7 +24,7 @@ export default function Routes() { setTransport(); }); navigator.serviceWorker.register("/sw.js", { - scope: "/~/" + scope: "/" }); } return ( From 65d104538a68600c8d0c7680856a879d710a0e55 Mon Sep 17 00:00:00 2001 From: MotorTruck1221 Date: Wed, 17 Apr 2024 08:56:34 -0600 Subject: [PATCH 2/2] Format goes brrr --- package.json | 130 ++++++++--------- src/components/ThemeProvider.tsx | 184 ++++++++++++------------ src/pages/Settings/Credits.tsx | 208 +++++++++++++-------------- src/pages/Settings/PersonCard.tsx | 36 ++--- src/pages/Settings/ThemeDropdown.tsx | 106 +++++++------- 5 files changed, 332 insertions(+), 332 deletions(-) diff --git a/package.json b/package.json index b4c1cd5..996e402 100644 --- a/package.json +++ b/package.json @@ -1,65 +1,65 @@ -{ - "name": "nebula", - "private": true, - "type": "module", - "scripts": { - "dev": "concurrently \"vite\" \"tsx server.ts\"", - "build": "vite build", - "bstart": "npm run build && tsx server.ts", - "start": "tsx server.ts", - "preview": "vite preview", - "format": "prettier --write ." - }, - "dependencies": { - "@fastify/compress": "^6.5.0", - "@fastify/cookie": "^9.3.1", - "@fastify/static": "^6.12.0", - "@mercuryworkshop/bare-mux": "^1.0.7", - "@mercuryworkshop/epoxy-transport": "^1.1.0", - "@mercuryworkshop/libcurl-transport": "^1.3.1", - "@nebula-services/dynamic": "0.7.2-patch.2", - "@titaniumnetwork-dev/ultraviolet": "^3.0.0", - "@tomphttp/bare-server-node": "2.0.3", - "@tsparticles/engine": "^3.3.0", - "@tsparticles/react": "^3.0.0", - "@tsparticles/slim": "^3.3.0", - "chalk": "^5.3.0", - "classnames": "^2.5.1", - "compression": "^1.7.4", - "cookie-parser": "^1.4.6", - "crypto-js": "^4.2.0", - "fastify": "^4.26.2", - "fastify-plugin": "^4.5.1", - "framer-motion": "^10.18.0", - "i18next": "^23.10.1", - "i18next-browser-languagedetector": "^7.2.0", - "localforage": "^1.10.0", - "million": "^2.6.4", - "preact": "^10.20.0", - "preact-iso": "^2.4.0", - "preact-render-to-string": "^6.4.1", - "preact-router": "^4.1.2", - "rammerhead": "https://github.com/NebulaServices/rammerhead/releases/download/rammerhead-1.2.41-nebula.8/rammerhead-1.2.41-nebula.7.tgz", - "react-helmet": "^6.1.0", - "react-i18next": "^13.5.0", - "react-icons": "^4.12.0", - "react-toastify": "^9.1.3", - "tsx": "^4.7.1", - "wisp-server-node": "^1.0.4", - "ws": "^8.16.0" - }, - "devDependencies": { - "@preact/preset-vite": "^2.8.2", - "autoprefixer": "^10.4.19", - "concurrently": "^8.2.2", - "eslint": "^8.57.0", - "eslint-config-preact": "^1.3.0", - "postcss": "^8.4.38", - "prettier": "^3.2.5", - "prettier-plugin-tailwindcss": "^0.5.12", - "tailwindcss": "^3.4.1", - "typescript": "^5.4.3", - "vite": "^5.2.3", - "vite-plugin-static-copy": "^1.0.1" - } -} +{ + "name": "nebula", + "private": true, + "type": "module", + "scripts": { + "dev": "concurrently \"vite\" \"tsx server.ts\"", + "build": "vite build", + "bstart": "npm run build && tsx server.ts", + "start": "tsx server.ts", + "preview": "vite preview", + "format": "prettier --write ." + }, + "dependencies": { + "@fastify/compress": "^6.5.0", + "@fastify/cookie": "^9.3.1", + "@fastify/static": "^6.12.0", + "@mercuryworkshop/bare-mux": "^1.0.7", + "@mercuryworkshop/epoxy-transport": "^1.1.0", + "@mercuryworkshop/libcurl-transport": "^1.3.1", + "@nebula-services/dynamic": "0.7.2-patch.2", + "@titaniumnetwork-dev/ultraviolet": "^3.0.0", + "@tomphttp/bare-server-node": "2.0.3", + "@tsparticles/engine": "^3.3.0", + "@tsparticles/react": "^3.0.0", + "@tsparticles/slim": "^3.3.0", + "chalk": "^5.3.0", + "classnames": "^2.5.1", + "compression": "^1.7.4", + "cookie-parser": "^1.4.6", + "crypto-js": "^4.2.0", + "fastify": "^4.26.2", + "fastify-plugin": "^4.5.1", + "framer-motion": "^10.18.0", + "i18next": "^23.10.1", + "i18next-browser-languagedetector": "^7.2.0", + "localforage": "^1.10.0", + "million": "^2.6.4", + "preact": "^10.20.0", + "preact-iso": "^2.4.0", + "preact-render-to-string": "^6.4.1", + "preact-router": "^4.1.2", + "rammerhead": "https://github.com/NebulaServices/rammerhead/releases/download/rammerhead-1.2.41-nebula.8/rammerhead-1.2.41-nebula.7.tgz", + "react-helmet": "^6.1.0", + "react-i18next": "^13.5.0", + "react-icons": "^4.12.0", + "react-toastify": "^9.1.3", + "tsx": "^4.7.1", + "wisp-server-node": "^1.0.4", + "ws": "^8.16.0" + }, + "devDependencies": { + "@preact/preset-vite": "^2.8.2", + "autoprefixer": "^10.4.19", + "concurrently": "^8.2.2", + "eslint": "^8.57.0", + "eslint-config-preact": "^1.3.0", + "postcss": "^8.4.38", + "prettier": "^3.2.5", + "prettier-plugin-tailwindcss": "^0.5.12", + "tailwindcss": "^3.4.1", + "typescript": "^5.4.3", + "vite": "^5.2.3", + "vite-plugin-static-copy": "^1.0.1" + } +} diff --git a/src/components/ThemeProvider.tsx b/src/components/ThemeProvider.tsx index 9afdf47..7077463 100644 --- a/src/components/ThemeProvider.tsx +++ b/src/components/ThemeProvider.tsx @@ -1,92 +1,92 @@ -import { createContext } from "preact"; -import { useContext, useEffect, useState } from "preact/hooks"; -type Theme = - | "main" - | "hacker" - | "catppuccin-mocha" - | "catppuccin-macchiato" - | "catppuccin-frappe" - | "catppuccin-latte"; -const themes: Theme[] = [ - "main", - "hacker", - "catppuccin-mocha", - "catppuccin-macchiato", - "catppuccin-frappe", - "catppuccin-latte" -]; -type ThemeProviderProps = { - children: React.ReactNode; -}; -type ThemeProviderState = { - themes: Theme[]; - theme: Theme; - background: string; - setTheme: (theme: Theme) => void; - setBackground: (background: string) => void; -}; - -const initialState: ThemeProviderState = { - themes: themes, - theme: "main", - background: "", - setTheme: () => null, - setBackground: () => null -}; - -const ThemeProviderContext = createContext(initialState); - -export function ThemeProvider({ children, ...props }: ThemeProviderProps) { - const defaultTheme = "main"; - const storageKey = "theme"; - const bgKey = "background"; - const [theme, setTheme] = useState( - () => (localStorage.getItem(storageKey) as Theme) || defaultTheme - ); - const [background, setBackground] = useState(() => - localStorage.getItem(bgKey) - ); - - useEffect(() => { - const root = window.document.documentElement; - - themes.forEach((theme) => { - root.classList.remove(theme); - }); - root.classList.add(theme); - if (background) { - document.documentElement.style.setProperty( - "--background-image", - `url(${background})` - ); - } - }, [theme, themes, background]); - - const value = { - theme, - themes, - background, - setTheme: (theme: Theme) => { - localStorage.setItem(storageKey, theme); - setTheme(theme); - }, - setBackground: (background: string) => { - localStorage.setItem(bgKey, background); - setBackground(background); - } - }; - - return ( - - {children} - - ); -} -export const useTheme = () => { - const context = useContext(ThemeProviderContext); - - if (context === undefined) - throw new Error("useTheme must be used within a ThemeProvider"); - - return context; -}; +import { createContext } from "preact"; +import { useContext, useEffect, useState } from "preact/hooks"; +type Theme = + | "main" + | "hacker" + | "catppuccin-mocha" + | "catppuccin-macchiato" + | "catppuccin-frappe" + | "catppuccin-latte"; +const themes: Theme[] = [ + "main", + "hacker", + "catppuccin-mocha", + "catppuccin-macchiato", + "catppuccin-frappe", + "catppuccin-latte" +]; +type ThemeProviderProps = { + children: React.ReactNode; +}; +type ThemeProviderState = { + themes: Theme[]; + theme: Theme; + background: string; + setTheme: (theme: Theme) => void; + setBackground: (background: string) => void; +}; + +const initialState: ThemeProviderState = { + themes: themes, + theme: "main", + background: "", + setTheme: () => null, + setBackground: () => null +}; + +const ThemeProviderContext = createContext(initialState); + +export function ThemeProvider({ children, ...props }: ThemeProviderProps) { + const defaultTheme = "main"; + const storageKey = "theme"; + const bgKey = "background"; + const [theme, setTheme] = useState( + () => (localStorage.getItem(storageKey) as Theme) || defaultTheme + ); + const [background, setBackground] = useState(() => + localStorage.getItem(bgKey) + ); + + useEffect(() => { + const root = window.document.documentElement; + + themes.forEach((theme) => { + root.classList.remove(theme); + }); + root.classList.add(theme); + if (background) { + document.documentElement.style.setProperty( + "--background-image", + `url(${background})` + ); + } + }, [theme, themes, background]); + + const value = { + theme, + themes, + background, + setTheme: (theme: Theme) => { + localStorage.setItem(storageKey, theme); + setTheme(theme); + }, + setBackground: (background: string) => { + localStorage.setItem(bgKey, background); + setBackground(background); + } + }; + + return ( + + {children} + + ); +} +export const useTheme = () => { + const context = useContext(ThemeProviderContext); + + if (context === undefined) + throw new Error("useTheme must be used within a ThemeProvider"); + + return context; +}; diff --git a/src/pages/Settings/Credits.tsx b/src/pages/Settings/Credits.tsx index 426ada6..ba6fbaf 100644 --- a/src/pages/Settings/Credits.tsx +++ b/src/pages/Settings/Credits.tsx @@ -1,104 +1,104 @@ -import { motion } from "framer-motion"; -import { tabContentVariant, settingsPageVariant } from "./Variants"; -import Dropdown from "./Dropdown"; -import { useTranslation } from "react-i18next"; -import { PersonCard } from "./PersonCard"; - -export const Credits = ({ id, active }) => { - const { t } = useTranslation(); - - return ( - - -
-
-

{t("credits.devs")}

-
- - - - - -
-

{t("credits.jpTranslators")}

-
- - - -
-

{t("credits.esTranslators")}

-
- - -
- -

Ultraviolet

- - -

Rammerhead

- - -

Dynamic

- - -

epoxy-tls

- - -

libcurl.js

- -
-
- - - ); -}; +import { motion } from "framer-motion"; +import { tabContentVariant, settingsPageVariant } from "./Variants"; +import Dropdown from "./Dropdown"; +import { useTranslation } from "react-i18next"; +import { PersonCard } from "./PersonCard"; + +export const Credits = ({ id, active }) => { + const { t } = useTranslation(); + + return ( + + +
+
+

{t("credits.devs")}

+
+ + + + + +
+

{t("credits.jpTranslators")}

+
+ + + +
+

{t("credits.esTranslators")}

+
+ + +
+ +

Ultraviolet

+ + +

Rammerhead

+ + +

Dynamic

+ + +

epoxy-tls

+ + +

libcurl.js

+ +
+
+ + + ); +}; diff --git a/src/pages/Settings/PersonCard.tsx b/src/pages/Settings/PersonCard.tsx index 69d41e0..81c96c6 100644 --- a/src/pages/Settings/PersonCard.tsx +++ b/src/pages/Settings/PersonCard.tsx @@ -1,18 +1,18 @@ -interface props { - name: string; - url: string; - profile: string; -} - -export const PersonCard = (props) => { - return ( -
-

- - - {props.name} - -

-
- ); -}; +interface props { + name: string; + url: string; + profile: string; +} + +export const PersonCard = (props) => { + return ( +
+

+ + + {props.name} + +

+
+ ); +}; diff --git a/src/pages/Settings/ThemeDropdown.tsx b/src/pages/Settings/ThemeDropdown.tsx index e93bc1b..3244f55 100644 --- a/src/pages/Settings/ThemeDropdown.tsx +++ b/src/pages/Settings/ThemeDropdown.tsx @@ -1,53 +1,53 @@ -import { useState } from "preact/hooks"; -import { FaAngleDown } from "react-icons/fa"; -import { useTheme } from "../../components/ThemeProvider"; -import { useTranslation } from "react-i18next"; - -const ThemeDropdown = () => { - const [isOpen, setIsOpen] = useState(false); - const { t } = useTranslation(); - const { theme, setTheme, themes } = useTheme(); - const options = themes.map((theme) => { - return { id: theme, label: t(`themes.${theme}`) }; - }); - return ( -
-
setIsOpen(!isOpen)} - > -
-
-
- {options.find((o) => o.id === theme)?.label} -
-
- -
-
- {isOpen && ( -
- {options.map((option, index) => ( -
{ - setIsOpen(false); - setTheme(option.id); - }} - > - {option.label} -
- ))} -
- )} -
-
- ); -}; - -export default ThemeDropdown; +import { useState } from "preact/hooks"; +import { FaAngleDown } from "react-icons/fa"; +import { useTheme } from "../../components/ThemeProvider"; +import { useTranslation } from "react-i18next"; + +const ThemeDropdown = () => { + const [isOpen, setIsOpen] = useState(false); + const { t } = useTranslation(); + const { theme, setTheme, themes } = useTheme(); + const options = themes.map((theme) => { + return { id: theme, label: t(`themes.${theme}`) }; + }); + return ( +
+
setIsOpen(!isOpen)} + > +
+
+
+ {options.find((o) => o.id === theme)?.label} +
+
+ +
+
+ {isOpen && ( +
+ {options.map((option, index) => ( +
{ + setIsOpen(false); + setTheme(option.id); + }} + > + {option.label} +
+ ))} +
+ )} +
+
+ ); +}; + +export default ThemeDropdown;