dahjah/headplane
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

fix: resolve type errors across the codebase

Browse Source
This commit is contained in:
Aarnav Tale 2024-11-04 18:13:10 -05:00
parent 10bb4eba97
commit 12754bd0aa
No known key found for this signature in database
6 changed files with 34 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
app/components/Toaster.tsx
View File

@ -1,7 +1,7 @@
import { XIcon } from '@primer/octicons-react'
import { type AriaToastProps, useToast, useToastRegion } from '@react-aria/toast'
import { ToastQueue, type ToastState, useToastQueue } from '@react-stately/toast'
import { type ReactNode, useRef } from 'react'
import { AriaToastProps, useToast, useToastRegion } from '@react-aria/toast'
import { ToastQueue, ToastState, useToastQueue } from '@react-stately/toast'
import { ReactNode, useRef } from 'react'
import { Button } from 'react-aria-components'
import { createPortal } from 'react-dom'
import { ClientOnly } from 'remix-utils/client-only'
@ -14,6 +14,8 @@ type ToastProperties = AriaToastProps<ReactNode> & {
function Toast({ state, ...properties }: ToastProperties) {
const reference = useRef(null)
// @ts-expect-error: RefObject doesn't map to FocusableElement?
const { toastProps, titleProps, closeButtonProps } = useToast(properties, state, reference)
return (
@ -52,11 +54,15 @@ export function toast(text: string) {
export function Toaster() {
const reference = useRef(null)
const state = useToastQueue(toasts)
// @ts-expect-error: React 19 has weird types for Portal vs Node
const { regionProps } = useToastRegion({}, state, reference)
return (
<ClientOnly>
{() => createPortal(
{
// @ts-expect-error: Portal doesn't match Node in React 19 yet
() => createPortal(
state.visibleToasts.length >= 0 ? (
<div
className={cn(

29
app/routes/_data.acls._index/route.tsx
View File

@ -55,7 +55,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
let modeGuess = 'database' // Assume database mode
if (context.config.read) {
const config = await loadConfig()
modeGuess = config.policy.mode
modeGuess = config.policy?.mode ?? 'database'
}
// Attempt to load the policy, for both the frontend and for checking
@ -96,7 +96,8 @@ export async function loader({ request }: LoaderFunctionArgs) {
return {
read: false,
write: false,
mode: modeGuess
mode: modeGuess,
policy: null
}
}
@ -106,7 +107,8 @@ export async function loader({ request }: LoaderFunctionArgs) {
return {
read: true,
write: true,
mode: modeGuess
mode: modeGuess,
policy: null
}
}
}
@ -114,7 +116,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
export async function action({ request }: ActionFunctionArgs) {
const session = await getSession(request.headers.get('Cookie'))
if (!session.has('hsApiKey')) {
return json({ success: false }, {
return json({ success: false, error: null }, {
status: 401,
})
}
@ -129,16 +131,18 @@ export async function action({ request }: ActionFunctionArgs) {
}
)
return json({ success: true, policy })
return json({ success: true, policy, error: null })
} catch (error) {
log.debug('APIC', 'Failed to update ACL policy with error %s', error)
// @ts-ignore: Shut UP we know it's a string most of the time
const text = JSON.parse(error.message)
return json({ success: false, error: text.message }, {
status: error instanceof HeadscaleError ? error.status : 500,
})
}
return json({ success: true })
return json({ success: true, error: null })
}
export default function Page() {
@ -154,6 +158,7 @@ export default function Page() {
return
}
// @ts-ignore: useDebounceFetcher is not typed correctly
if (fetcher.data.success) {
toast('Updated tailnet ACL policy')
} else {
@ -183,6 +188,7 @@ export default function Page() {
}
// If we have a failed fetcher state allow the user to try again
// @ts-ignore: useDebounceFetcher is not typed correctly
if (fetcher.data?.success === false) {
return false
}
@ -231,8 +237,11 @@ export default function Page() {
.
</p>
{fetcher.data?.success === false
{
// @ts-ignore: useDebounceFetcher is not typed correctly
fetcher.data?.success === false
? (
// @ts-ignore: useDebounceFetcher is not typed correctly
<ErrorView message={fetcher.data.error} />
) : undefined}
@ -291,7 +300,7 @@ export default function Page() {
</TabPanel>
<TabPanel id="diff">
<Differ
left={data.policy}
left={data?.policy ?? ''}
right={acl}
/>
</TabPanel>
@ -335,13 +344,13 @@ export default function Page() {
<Button
isDisabled={disabled}
onPress={() => {
setAcl(data.policy)
setAcl(data?.policy ?? '')
}}
>
Discard Changes
</Button>
</>
) : <Unavailable mode={data.mode} />}
) : <Unavailable mode={data.mode as "database" | "file"} />}
</div>
)
}

2
app/routes/_data.machines._index/dialogs/new.tsx
View File

@ -18,7 +18,7 @@ export interface NewProps {
}
export default function New(data: NewProps) {
const fetcher = useFetcher()
const fetcher = useFetcher<{ success?: boolean }>()
const mkeyState = useState(false)
const [mkey, setMkey] = useState('')
const [user, setUser] = useState('')

5
app/routes/_data.settings._index/route.tsx
View File

@ -31,10 +31,7 @@ export default function Page() {
</Link>
</p>
</div>
<RemixLink
to="/settings/auth-keys"
name="Auth Keys"
>
<RemixLink to="/settings/auth-keys">
<span className={cn(
'text-lg font-medium',
'text-gray-700 dark:text-gray-300',

4
app/routes/_data.settings.auth-keys._index/dialogs/new.tsx
View File

@ -94,7 +94,7 @@ export default function AddPreAuthKey(data: Props) {
onChange={() => { setReusable(!reusable) }}
/>
</div>
<input type="hidden" name="reusable" value={reusable} />
<input type="hidden" name="reusable" value={reusable.toString()} />
<div className="flex justify-between items-center mt-6">
<div>
<Dialog.Text className="font-semibold">
@ -121,7 +121,7 @@ export default function AddPreAuthKey(data: Props) {
}}
/>
</div>
<input type="hidden" name="ephemeral" value={ephemeral} />
<input type="hidden" name="ephemeral" value={ephemeral.toString()} />
<div className="mt-6 flex justify-end gap-2 mt-6">
<Dialog.Action
variant="cancel"

2
app/routes/_data.settings.auth-keys._index/key.tsx
View File

@ -39,7 +39,7 @@ export default function AuthKeyRow({ authKey, server }: Props) {
<Button
variant="light"
className="my-4"
onClick={async () => {
onPress={async () => {
await navigator.clipboard.writeText(
`tailscale up --login-server ${server} --authkey ${authKey.key}`
)