mirror of
https://github.com/tale/headplane.git
synced 2026-08-27 07:27:41 +00:00
chore: switch to react-router v7
This commit is contained in:
+43
-52
@@ -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>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user