handleChange(key, val)}
+ />
+ );
+ } else if (type === "string") {
+ // Text input
+ return (
+ handleChange(key, e.target.value)}
+ />
+ );
+ } else if (type === "number") {
+ // Number input
+ return (
+ handleChange(key, Number(e.target.value))}
+ />
+ );
+ }
+ };
+
+ return (
+ <>
+ {Object.entries(schema).map(([key, type]) => (
+
+
+ {renderInput(key, type)}
+
+ ))}
+
+ );
+}
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
new file mode 100644
index 0000000..fa0e4b5
--- /dev/null
+++ b/src/components/ui/checkbox.tsx
@@ -0,0 +1,32 @@
+"use client"
+
+import * as React from "react"
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
+import { CheckIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Checkbox({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+
+
+ )
+}
+
+export { Checkbox }
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
new file mode 100644
index 0000000..dcbbc0c
--- /dev/null
+++ b/src/components/ui/select.tsx
@@ -0,0 +1,185 @@
+"use client"
+
+import * as React from "react"
+import * as SelectPrimitive from "@radix-ui/react-select"
+import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function Select({
+ ...props
+}: React.ComponentProps) {
+ return
+}
+
+function SelectGroup({
+ ...props
+}: React.ComponentProps) {
+ return
+}
+
+function SelectValue({
+ ...props
+}: React.ComponentProps) {
+ return
+}
+
+function SelectTrigger({
+ className,
+ size = "default",
+ children,
+ ...props
+}: React.ComponentProps & {
+ size?: "sm" | "default"
+}) {
+ return (
+
+ {children}
+
+
+
+
+ )
+}
+
+function SelectContent({
+ className,
+ children,
+ position = "popper",
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+
+ {children}
+
+
+
+
+ )
+}
+
+function SelectLabel({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+ )
+}
+
+function SelectItem({
+ className,
+ children,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+
+
+
+ {children}
+
+ )
+}
+
+function SelectSeparator({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+ )
+}
+
+function SelectScrollUpButton({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+ )
+}
+
+function SelectScrollDownButton({
+ className,
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+ )
+}
+
+export {
+ Select,
+ SelectContent,
+ SelectGroup,
+ SelectItem,
+ SelectLabel,
+ SelectScrollDownButton,
+ SelectScrollUpButton,
+ SelectSeparator,
+ SelectTrigger,
+ SelectValue,
+}
diff --git a/src/hooks/use-settings.ts b/src/hooks/use-settings.ts
new file mode 100644
index 0000000..a4e51f5
--- /dev/null
+++ b/src/hooks/use-settings.ts
@@ -0,0 +1,18 @@
+"use client";
+
+import { defaultSettings, getClientSettings } from "@/lib/clientSettings";
+import { ClientSettings } from "@/types/settings";
+import { Dispatch, SetStateAction, useEffect, useState } from "react";
+
+export function useClientSettings(): [
+ ClientSettings,
+ Dispatch>
+] {
+ const [settings, setSettings] = useState(defaultSettings);
+
+ useEffect(() => {
+ setSettings(getClientSettings());
+ }, []);
+
+ return [settings, setSettings];
+}
diff --git a/src/lib/clientSettings.ts b/src/lib/clientSettings.ts
index 1822546..4a7e385 100644
--- a/src/lib/clientSettings.ts
+++ b/src/lib/clientSettings.ts
@@ -1,7 +1,7 @@
-import { ClientSettings } from "@/types/config";
+import { ClientSettings } from "@/types/settings";
import Cookies from "js-cookie";
-const defaultSettings: ClientSettings = {
+export const defaultSettings: ClientSettings = {
theme: "dark",
};
diff --git a/src/types/config.ts b/src/types/config.ts
deleted file mode 100644
index 7c196d0..0000000
--- a/src/types/config.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export interface ClientSettings {
- theme: "light" | "dark";
-}
-
-export interface AccountSettings {}
diff --git a/src/types/settings.ts b/src/types/settings.ts
new file mode 100644
index 0000000..22a5b15
--- /dev/null
+++ b/src/types/settings.ts
@@ -0,0 +1,15 @@
+import { SettingsSchema } from "@/app/settings/settings";
+
+export interface ClientSettings {
+ theme: "light" | "dark";
+}
+
+export interface AccountSettings {}
+
+export const CLIENT_SCHEMA: SettingsSchema = {
+ theme: ["light", "dark"],
+};
+
+export const ACCOUNT_SCHEMA: SettingsSchema = {
+ node_ip: "string",
+};