diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx index b4fa1c10..babdd327 100644 --- a/src/components/Icon.tsx +++ b/src/components/Icon.tsx @@ -57,6 +57,8 @@ export enum Icons { COINS = "coins", LOGOUT = "logout", MENU = "menu", + LOCK = "lock", + UNLOCK = "unlock", } export interface IconProps { @@ -121,6 +123,8 @@ const iconList: Record = { coins: ``, logout: ``, menu: ``, + lock: ``, + unlock: ``, }; function ChromeCastButton() { diff --git a/src/pages/Settings.tsx b/src/pages/Settings.tsx index f1c832a3..0f431ddb 100644 --- a/src/pages/Settings.tsx +++ b/src/pages/Settings.tsx @@ -42,7 +42,7 @@ function SettingsLayout(props: { children: React.ReactNode }) {
diff --git a/src/pages/parts/settings/SidebarPart.tsx b/src/pages/parts/settings/SidebarPart.tsx index 11dd85ff..145122be 100644 --- a/src/pages/parts/settings/SidebarPart.tsx +++ b/src/pages/parts/settings/SidebarPart.tsx @@ -1,15 +1,38 @@ +import classNames from "classnames"; import { useCallback, useEffect, useState } from "react"; import Sticky from "react-stickynode"; import { useAsync } from "react-use"; import { getBackendMeta } from "@/backend/accounts/meta"; -import { Icons } from "@/components/Icon"; +import { Icon, Icons } from "@/components/Icon"; import { SidebarLink, SidebarSection } from "@/components/layout/Sidebar"; import { Divider } from "@/components/utils/Divider"; import { useBackendUrl } from "@/hooks/auth/useBackendUrl"; import { useIsMobile } from "@/hooks/useIsMobile"; import { conf } from "@/setup/config"; +function BackendUrl(props: { url: string }) { + const url = props.url.replace(/https?:\/\//, ""); + const secure = props.url.startsWith("https://"); + return ( +
+
+ +
+ {url} +
+ ); +} + export function SidebarPart() { const { isMobile } = useIsMobile(); // eslint-disable-next-line no-restricted-globals @@ -95,7 +118,7 @@ export function SidebarPart() {
- +
Version {conf().APP_VERSION} @@ -111,8 +134,10 @@ export function SidebarPart() { {backendMeta.value.version}
- Backend URL - {backendUrl} + Backend URL + + +
) : null}