lnn0q/ln
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

implemented identity, updated session, added 'workings' list

Browse source 
added paginated querying, added 'common'
This commit is contained in:
lnn0q 2025-05-17 00:29:55 +03:00
parent 027deba422
commit 6ada519e06
36 changed files with 1422 additions and 279 deletions
Download patch file Download diff file Expand all files Collapse all files

102
app/client/pages/__root.tsx
View file

@ -1,12 +1,13 @@
import { Separator, Icon, Menu, Stack, Text } from '@chakra-ui/react';
import { Icon, Input, InputGroup, Kbd, Menu, Separator, Stack, Text } from '@chakra-ui/react';
import { createRootRouteWithContext, Link, Outlet } from '@tanstack/react-router';
import React from 'react';
import { Avatar } from '../components/ui/avatar';
import { Button } from '../components/ui/button';
import { ColorModeButton } from '../components/ui/color-mode';
import { Tooltip } from '../components/ui/tooltip';
import { useAuth } from '../hooks/auth';
import { useIdentity } from '../hooks/identity';
import { appName } from '../main';
import { ColorModeButton } from '../components/ui/color-mode';
const TanStackRouterDevtools =
process.env.NODE_ENV === 'production'
@ -26,48 +27,82 @@ interface RouterContext {
export const Route = createRootRouteWithContext<RouterContext>()({
component: () => {
const { isAuthenticated, logout } = useAuth();
const { logout } = useAuth();
const identity = useIdentity();
return (
<Stack padding={3}>
<Stack flexDirection="row" justifyContent="space-between" alignItems="center">
<Stack flexDirection="row" alignItems="center" gap={4}>
<Stack flexDirection="row" justifyContent="center" alignItems="center" gap={4}>
<Link to="/">
<Text color="colorPalette.500" fontSize="xl">
[{appName}]
</Text>
</Link>
<Link to="/about">
<Icon color="colorPalette.500" fontSize="md">
<i className="nf nf-oct-question" />
</Icon>
<Stack direction="row" justifyContent="center" alignItems="center" gap={1}>
<Icon fontSize={24} color="colorPalette.500">
<i className="nf nf-md-bird" />
</Icon>
<Text fontSize="lg" fontWeight="bold">
{appName}
</Text>
</Stack>
</Link>
{/* <Stack hideBelow="md"> */}
{/* <Link to="/about"> */}
{/* <Icon color="colorPalette.500" fontSize="md"> */}
{/* <i className="nf nf-oct-question" /> */}
{/* </Icon> */}
{/* </Link> */}
{/* </Stack> */}
</Stack>
<Stack flexDirection="row" alignItems="center" gap={4}>
<InputGroup
hideBelow="md"
flex={1}
alignItems="center"
startElement={
<Icon color="colorPalette.500">
<i className="nf nf-oct-search" />
</Icon>
}
endElement={<Kbd>⌘K</Kbd>}
>
<Input height={8} placeholder="Search works..." />
</InputGroup>
<ColorModeButton />
{isAuthenticated ? (
{identity != null ? (
<Menu.Root>
<Menu.Trigger>
<Menu.Trigger css={{ '&:hover': { cursor: 'pointer' } }}>
<Avatar
// src={'https://avatars.githubusercontent.com/u/40203084?v=4'}
fallback={'A'}
size="sm"
// src="https://avatars.githubusercontent.com/u/40203084?v=4"
/>
</Menu.Trigger>
<Menu.Positioner mt={2}>
<Menu.Content>
<>
<Menu.Item value="logout" onClick={async () => logout()}>
<Tooltip content="Log out">
<Menu.Content backgroundColor={'bg.subtle'}>
<Link to={`/profile/${identity.data.user.username}`}>
<Menu.Item value="/">
<Tooltip content="My profile">
<Stack direction="row">
<Icon color="colorPalette.500" fontSize="xl">
<i className="nf nf-fa-sign_out" />
<i className="nf nf-fa-user" />
</Icon>
Log out
My profile
</Stack>
</Tooltip>
</Menu.Item>
</>
</Link>
<Menu.Item value="logout" onClick={async () => logout()}>
<Tooltip content="Log out">
<Stack direction="row">
<Icon color="colorPalette.500" fontSize="xl">
<i className="nf nf-fa-sign_out" />
</Icon>
Log out
</Stack>
</Tooltip>
</Menu.Item>
</Menu.Content>
</Menu.Positioner>
</Menu.Root>
@ -75,30 +110,13 @@ export const Route = createRootRouteWithContext<RouterContext>()({
<>
<Separator orientation="vertical" height={5} />
<Link to="/login">
<Button>Sign in</Button>
<Button height={8}>Sign in</Button>
</Link>
<Link to="/register">
<Button>Sign up</Button>
<Button height={8}>Sign up</Button>
</Link>
</>
)}
{/* {!isAuthenticated ? (
<>
<Link to="/login">
<Button>Sign in</Button>
</Link>
<Link to="/register">
<Button>Sign up</Button>
</Link>
</>
) : (
<Tooltip content="Log out">
<Icon color="colorPalette.500" fontSize="xl" onClick={async () => logout()}>
<i className="nf nf-fa-sign_out" />
</Icon>
</Tooltip>
)} */}
</Stack>
</Stack>
<Separator style={{ padding: '4px' }} />