chore: switch to react-router v7

This commit is contained in:
Aarnav Tale
2024-12-31 10:30:14 +05:30
parent 39504e2487
commit aa9872a45b
101 changed files with 3825 additions and 6796 deletions
+43 -52
View File
@@ -1,27 +1,27 @@
import { ActionFunctionArgs } from '@remix-run/node'
import { json, useLoaderData } from '@remix-run/react'
import { ActionFunctionArgs } from 'react-router';
import { json, useLoaderData } from 'react-router';
import Code from '~/components/Code'
import Notice from '~/components/Notice'
import { loadContext } from '~/utils/config/headplane'
import { loadConfig, patchConfig } from '~/utils/config/headscale'
import { getSession } from '~/utils/sessions'
import { useLiveData } from '~/utils/useLiveData'
import Code from '~/components/Code';
import Notice from '~/components/Notice';
import { loadContext } from '~/utils/config/headplane';
import { loadConfig, patchConfig } from '~/utils/config/headscale';
import { getSession } from '~/utils/sessions';
import { useLiveData } from '~/utils/useLiveData';
import DNS from './components/dns'
import Domains from './components/domains'
import MagicModal from './components/magic'
import Nameservers from './components/nameservers'
import RenameModal from './components/rename'
import DNS from './components/dns';
import Domains from './components/domains';
import MagicModal from './components/magic';
import Nameservers from './components/nameservers';
import RenameModal from './components/rename';
// We do not want to expose every config value
export async function loader() {
const context = await loadContext()
const context = await loadContext();
if (!context.config.read) {
throw new Error('No configuration is available')
throw new Error('No configuration is available');
}
const config = await loadConfig()
const config = await loadConfig();
const dns = {
prefixes: config.prefixes,
magicDns: config.dns.magic_dns,
@@ -32,65 +32,58 @@ export async function loader() {
splitDns: config.dns.nameservers.split,
searchDomains: config.dns.search_domains,
extraRecords: config.dns.extra_records,
}
};
return {
...dns,
...context,
}
};
}
export async function action({ request }: ActionFunctionArgs) {
const session = await getSession(request.headers.get('Cookie'))
const session = await getSession(request.headers.get('Cookie'));
if (!session.has('hsApiKey')) {
return send({ success: false }, 401)
return send({ success: false }, 401);
}
const context = await loadContext()
const context = await loadContext();
if (!context.config.write) {
return send({ success: false }, 403)
return send({ success: false }, 403);
}
const data = await request.json() as Record<string, unknown>
await patchConfig(data)
const data = (await request.json()) as Record<string, unknown>;
await patchConfig(data);
if (context.integration?.onConfigChange) {
await context.integration.onConfigChange(context.integration.context)
await context.integration.onConfigChange(context.integration.context);
}
return { success: true }
return { success: true };
}
export default function Page() {
useLiveData({ interval: 5000 })
const data = useLoaderData<typeof loader>()
useLiveData({ interval: 5000 });
const data = useLoaderData<typeof loader>();
const allNs: Record<string, string[]> = {}
const allNs: Record<string, string[]> = {};
for (const key of Object.keys(data.splitDns)) {
allNs[key] = data.splitDns[key]
allNs[key] = data.splitDns[key];
}
allNs.global = data.nameservers
allNs.global = data.nameservers;
return (
<div className="flex flex-col gap-16 max-w-screen-lg">
{data.config.write
? undefined
: (
<Notice>
The Headscale configuration is read-only. You cannot make changes to the configuration
</Notice>
)}
{data.config.write ? undefined : (
<Notice>
The Headscale configuration is read-only. You cannot make changes to
the configuration
</Notice>
)}
<RenameModal name={data.baseDomain} disabled={!data.config.write} />
<Nameservers
nameservers={allNs}
isDisabled={!data.config.write}
/>
<Nameservers nameservers={allNs} isDisabled={!data.config.write} />
<DNS
records={data.extraRecords}
isDisabled={!data.config.write}
/>
<DNS records={data.extraRecords} isDisabled={!data.config.write} />
<Domains
baseDomain={data.magicDns ? data.baseDomain : undefined}
@@ -101,18 +94,16 @@ export default function Page() {
<div className="flex flex-col w-2/3">
<h1 className="text-2xl font-medium mb-4">Magic DNS</h1>
<p className="text-gray-700 dark:text-gray-300 mb-4">
Automatically register domain names for each device
on the tailnet. Devices will be accessible at
{' '}
Automatically register domain names for each device on the tailnet.
Devices will be accessible at{' '}
<Code>
[device].
{data.baseDomain}
</Code>
{' '}
</Code>{' '}
when Magic DNS is enabled.
</p>
<MagicModal isEnabled={data.magicDns} disabled={!data.config.write} />
</div>
</div>
)
);
}