From 785d5a663fcd7b54400d23928ae1af16b43f43e0 Mon Sep 17 00:00:00 2001
From: Aarnav Tale <aarnavtale@icloud.com>
Date: Sun, 6 Apr 2025 13:44:09 -0400
Subject: [PATCH] chore: reorganize settings code layout

---
 app/routes.ts                                 |  4 +--
 app/routes/settings/auth-keys/actions.ts      |  0
 .../key.tsx => auth-keys/auth-key-row.tsx}    |  4 +--
 .../dialogs/add-auth-key.tsx}                 |  4 +--
 .../dialogs/expire-auth-key.tsx}              |  4 +--
 .../{auth-keys.tsx => auth-keys/overview.tsx} |  6 ++---
 .../actions.ts}                               |  0
 .../{ => restrictions}/dialogs/add-domain.tsx |  0
 .../{ => restrictions}/dialogs/add-group.tsx  |  0
 .../{ => restrictions}/dialogs/add-user.tsx   |  0
 .../overview.tsx}                             | 26 +++++++++++--------
 .../table.tsx}                                |  2 +-
 12 files changed, 27 insertions(+), 23 deletions(-)
 create mode 100644 app/routes/settings/auth-keys/actions.ts
 rename app/routes/settings/{components/key.tsx => auth-keys/auth-key-row.tsx} (94%)
 rename app/routes/settings/{dialogs/new.tsx => auth-keys/dialogs/add-auth-key.tsx} (96%)
 rename app/routes/settings/{dialogs/expire.tsx => auth-keys/dialogs/expire-auth-key.tsx} (85%)
 rename app/routes/settings/{auth-keys.tsx => auth-keys/overview.tsx} (97%)
 rename app/routes/settings/{actions/restriction.ts => restrictions/actions.ts} (100%)
 rename app/routes/settings/{ => restrictions}/dialogs/add-domain.tsx (100%)
 rename app/routes/settings/{ => restrictions}/dialogs/add-group.tsx (100%)
 rename app/routes/settings/{ => restrictions}/dialogs/add-user.tsx (100%)
 rename app/routes/settings/{pages/restrictions.tsx => restrictions/overview.tsx} (87%)
 rename app/routes/settings/{components/restriction.tsx => restrictions/table.tsx} (97%)

diff --git a/app/routes.ts b/app/routes.ts
index cd45e65..d5f7666 100644
--- a/app/routes.ts
+++ b/app/routes.ts
@@ -28,8 +28,8 @@ export default [
 
 			...prefix('/settings', [
 				index('routes/settings/overview.tsx'),
-				route('/auth-keys', 'routes/settings/auth-keys.tsx'),
-				route('/restrictions', 'routes/settings/pages/restrictions.tsx'),
+				route('/auth-keys', 'routes/settings/auth-keys/overview.tsx'),
+				route('/restrictions', 'routes/settings/restrictions/overview.tsx'),
 				// route('/local-agent', 'routes/settings/local-agent.tsx'),
 			]),
 		]),
diff --git a/app/routes/settings/auth-keys/actions.ts b/app/routes/settings/auth-keys/actions.ts
new file mode 100644
index 0000000..e69de29
diff --git a/app/routes/settings/components/key.tsx b/app/routes/settings/auth-keys/auth-key-row.tsx
similarity index 94%
rename from app/routes/settings/components/key.tsx
rename to app/routes/settings/auth-keys/auth-key-row.tsx
index 73a8ed5..2cf073c 100644
--- a/app/routes/settings/components/key.tsx
+++ b/app/routes/settings/auth-keys/auth-key-row.tsx
@@ -4,7 +4,7 @@ import Attribute from '~/components/Attribute';
 import Button from '~/components/Button';
 import Code from '~/components/Code';
 import toast from '~/utils/toast';
-import ExpireKey from '../dialogs/expire';
+import ExpireAuthKey from './dialogs/expire-auth-key';
 
 interface Props {
 	authKey: PreAuthKey;
@@ -37,7 +37,7 @@ export default function AuthKeyRow({ authKey, server }: Props) {
 			<div suppressHydrationWarning className="flex gap-4 items-center">
 				{(authKey.used && !authKey.reusable) ||
 				new Date(authKey.expiration) < new Date() ? undefined : (
-					<ExpireKey authKey={authKey} />
+					<ExpireAuthKey authKey={authKey} />
 				)}
 				<Button
 					variant="light"
diff --git a/app/routes/settings/dialogs/new.tsx b/app/routes/settings/auth-keys/dialogs/add-auth-key.tsx
similarity index 96%
rename from app/routes/settings/dialogs/new.tsx
rename to app/routes/settings/auth-keys/dialogs/add-auth-key.tsx
index 89e0f21..c46afa0 100644
--- a/app/routes/settings/dialogs/new.tsx
+++ b/app/routes/settings/auth-keys/dialogs/add-auth-key.tsx
@@ -7,12 +7,12 @@ import Select from '~/components/Select';
 import Switch from '~/components/Switch';
 import type { User } from '~/types';
 
-interface Props {
+interface AddAuthKeyProps {
 	users: User[];
 }
 
 // TODO: Tags
-export default function AddPreAuthKey(data: Props) {
+export default function AddAuthKey(data: AddAuthKeyProps) {
 	const [reusable, setReusable] = useState(false);
 	const [ephemeral, setEphemeral] = useState(false);
 
diff --git a/app/routes/settings/dialogs/expire.tsx b/app/routes/settings/auth-keys/dialogs/expire-auth-key.tsx
similarity index 85%
rename from app/routes/settings/dialogs/expire.tsx
rename to app/routes/settings/auth-keys/dialogs/expire-auth-key.tsx
index bdf26f7..26057ee 100644
--- a/app/routes/settings/dialogs/expire.tsx
+++ b/app/routes/settings/auth-keys/dialogs/expire-auth-key.tsx
@@ -1,11 +1,11 @@
 import Dialog from '~/components/Dialog';
 import type { PreAuthKey } from '~/types';
 
-interface Props {
+interface ExpireAuthKeyProps {
 	authKey: PreAuthKey;
 }
 
-export default function ExpireKey({ authKey }: Props) {
+export default function ExpireAuthKey({ authKey }: ExpireAuthKeyProps) {
 	return (
 		<Dialog>
 			<Dialog.Button>Expire Key</Dialog.Button>
diff --git a/app/routes/settings/auth-keys.tsx b/app/routes/settings/auth-keys/overview.tsx
similarity index 97%
rename from app/routes/settings/auth-keys.tsx
rename to app/routes/settings/auth-keys/overview.tsx
index 00a3432..8742d81 100644
--- a/app/routes/settings/auth-keys.tsx
+++ b/app/routes/settings/auth-keys/overview.tsx
@@ -8,8 +8,8 @@ import TableList from '~/components/TableList';
 import type { LoadContext } from '~/server';
 import type { PreAuthKey, User } from '~/types';
 import { send } from '~/utils/res';
-import AuthKeyRow from './components/key';
-import AddPreAuthKey from './dialogs/new';
+import AuthKeyRow from './auth-key-row';
+import AddAuthKey from './dialogs/add-auth-key';
 
 export async function loader({
 	request,
@@ -168,7 +168,7 @@ export default function Page() {
 					Tailscale documentation
 				</Link>
 			</p>
-			<AddPreAuthKey users={users} />
+			<AddAuthKey users={users} />
 			<div className="flex items-center gap-4 mt-4">
 				<Select
 					label="Filter by User"
diff --git a/app/routes/settings/actions/restriction.ts b/app/routes/settings/restrictions/actions.ts
similarity index 100%
rename from app/routes/settings/actions/restriction.ts
rename to app/routes/settings/restrictions/actions.ts
diff --git a/app/routes/settings/dialogs/add-domain.tsx b/app/routes/settings/restrictions/dialogs/add-domain.tsx
similarity index 100%
rename from app/routes/settings/dialogs/add-domain.tsx
rename to app/routes/settings/restrictions/dialogs/add-domain.tsx
diff --git a/app/routes/settings/dialogs/add-group.tsx b/app/routes/settings/restrictions/dialogs/add-group.tsx
similarity index 100%
rename from app/routes/settings/dialogs/add-group.tsx
rename to app/routes/settings/restrictions/dialogs/add-group.tsx
diff --git a/app/routes/settings/dialogs/add-user.tsx b/app/routes/settings/restrictions/dialogs/add-user.tsx
similarity index 100%
rename from app/routes/settings/dialogs/add-user.tsx
rename to app/routes/settings/restrictions/dialogs/add-user.tsx
diff --git a/app/routes/settings/pages/restrictions.tsx b/app/routes/settings/restrictions/overview.tsx
similarity index 87%
rename from app/routes/settings/pages/restrictions.tsx
rename to app/routes/settings/restrictions/overview.tsx
index b6837d7..53c6f73 100644
--- a/app/routes/settings/pages/restrictions.tsx
+++ b/app/routes/settings/restrictions/overview.tsx
@@ -9,11 +9,11 @@ import Link from '~/components/Link';
 import Notice from '~/components/Notice';
 import { LoadContext } from '~/server';
 import { Capabilities } from '~/server/web/roles';
-import { restrictionAction } from '../actions/restriction';
-import Restriction from '../components/restriction';
-import AddDomain from '../dialogs/add-domain';
-import AddGroup from '../dialogs/add-group';
-import AddUser from '../dialogs/add-user';
+import { restrictionAction } from './actions';
+import AddDomain from './dialogs/add-domain';
+import AddGroup from './dialogs/add-group';
+import AddUser from './dialogs/add-user';
+import RestrictionTable from './table';
 
 export async function loader({
 	request,
@@ -92,23 +92,27 @@ export default function Page() {
 					</Link>
 				</p>
 			</div>
-			<Restriction
+			<RestrictionTable
 				type="domain"
 				values={settings.domains}
 				isDisabled={isDisabled}
 			>
 				<AddDomain domains={settings.domains} isDisabled={isDisabled} />
-			</Restriction>
-			<Restriction
+			</RestrictionTable>
+			<RestrictionTable
 				type="group"
 				values={settings.groups}
 				isDisabled={isDisabled}
 			>
 				<AddGroup groups={settings.groups} isDisabled={isDisabled} />
-			</Restriction>
-			<Restriction type="user" values={settings.users} isDisabled={isDisabled}>
+			</RestrictionTable>
+			<RestrictionTable
+				type="user"
+				values={settings.users}
+				isDisabled={isDisabled}
+			>
 				<AddUser users={settings.users} isDisabled={isDisabled} />
-			</Restriction>
+			</RestrictionTable>
 		</div>
 	);
 }
diff --git a/app/routes/settings/components/restriction.tsx b/app/routes/settings/restrictions/table.tsx
similarity index 97%
rename from app/routes/settings/components/restriction.tsx
rename to app/routes/settings/restrictions/table.tsx
index fb196ce..f054a89 100644
--- a/app/routes/settings/components/restriction.tsx
+++ b/app/routes/settings/restrictions/table.tsx
@@ -12,7 +12,7 @@ interface RestrictionProps {
 	isDisabled?: boolean;
 }
 
-export default function Restriction({
+export default function RestrictionTable({
 	children,
 	type,
 	values,