dumtruck/konobangu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: fix typos

Browse Source
This commit is contained in:
master 2025-03-08 02:49:49 +08:00
parent 27cdcdef58
commit e66573b315
18 changed files with 1159 additions and 585 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
apps/webui/package.json
View File

@ -9,6 +9,7 @@
"preview": "rsbuild preview"
},
"dependencies": {
"@abraham/reflection": "^0.12.0",
"@ark-ui/solid": "^4.10.2",
"@codemirror/language": "6.0.0",
"@corvu/drawer": "^0.2.3",
@ -17,44 +18,43 @@
"@graphiql/toolkit": "^0.11.1",
"@kobalte/core": "^0.13.9",
"@kobalte/tailwindcss": "^0.9.0",
"@outposts/injection-js": "^2.5.1",
"@solid-primitives/graphql": "^2.2.0",
"@solid-primitives/refs": "^1.1.0",
"@tailwindcss/postcss": "^4.0.9",
"@tanstack/solid-router": "^1.112.2",
"@tanstack/react-router": "^1.112.13",
"@tanstack/router-devtools": "^1.112.13",
"@tanstack/solid-router": "^1.112.12",
"arktype": "^2.1.6",
"chart.js": "^4.4.8",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk-solid": "^1.1.2",
"embla-carousel-solid": "^8.5.2",
"graphiql": "^3.8.3",
"lucide-solid": "^0.477.0",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"oidc-client-rx": "0.1.0-alpha.9",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"rxjs": "^7.8.2",
"solid-js": "^1.9.5",
"solid-sonner": "^0.2.8",
"tailwindcss": "^3.4.17",
"tailwind-merge": "^3.0.2",
"tailwindcss-animate": "^1.0.7",
"@tanstack/react-router": "^1.112.0",
"@tanstack/router-devtools": "^1.112.6",
"class-variance-authority": "^0.7.1",
"@abraham/reflection": "^0.12.0",
"@outposts/injection-js": "^2.5.1",
"arktype": "^2.1.2",
"clsx": "^2.1.1",
"oidc-client-rx": "0.1.0-alpha.8",
"rxjs": "^7.8.2"
"tailwindcss": "^3.4.17",
"tailwindcss-animate": "^1.0.7"
},
"devDependencies": {
"@rsbuild/core": "^1.2.14",
"@rsbuild/core": "^1.2.15",
"@rsbuild/plugin-babel": "^1.0.4",
"@rsbuild/plugin-solid": "^1.0.5",
"@tailwindcss/postcss": "^4.0.9",
"@tanstack/react-router": "^1.112.0",
"@tanstack/router-devtools": "^1.112.6",
"@tanstack/router-plugin": "^1.112.13",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"chalk": "^5.4.1",
"commander": "^13.1.0",
"postcss": "^8.5.3",
"@rsbuild/plugin-solid": "^1.0.5",
"@tanstack/react-router": "^1.112.0",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@tailwindcss/postcss": "^4.0.9",
"@tanstack/router-devtools": "^1.112.6",
"@tanstack/router-plugin": "^1.112.3"
"postcss": "^8.5.3"
}
}

31
apps/webui/src/auth/hooks.ts
View File

@ -3,8 +3,8 @@ import {
InjectorContextVoidInjector,
useOidcClient,
} from 'oidc-client-rx/adapters/solid-js';
import { NEVER, of } from 'rxjs';
import { createMemo, from } from 'solid-js';
import { NEVER, map, of } from 'rxjs';
import { from } from 'solid-js';
import { isBasicAuth, isOidcAuth } from './config';
const BASIC_AUTH_IS_AUTHENTICATED$ = of({
@ -17,34 +17,39 @@ const BASIC_AUTH_USER_DATA$ = of({
allUserData: [],
});
const useOidcClientExt = isOidcAuth ? useOidcClient : () => ({ oidcSecurityService: undefined, injector: InjectorContextVoidInjector })
const useOidcClientExt = isOidcAuth
? useOidcClient
: () => ({
oidcSecurityService: undefined,
injector: InjectorContextVoidInjector,
});
export function useAuth() {
const { oidcSecurityService, injector } = useOidcClientExt();
const isAuthenticatedObj = from(
const isAuthenticated$ = (
oidcSecurityService?.isAuthenticated$ ?? BASIC_AUTH_IS_AUTHENTICATED$
);
).pipe(map((s) => s.isAuthenticated));
const userDataObj = from(
const userData$ = (
oidcSecurityService?.userData$ ?? BASIC_AUTH_USER_DATA$
);
).pipe(map((s) => s.userData));
const isAuthenticated = createMemo(
() => isAuthenticatedObj()?.isAuthenticated ?? false
);
const isAuthenticated = from(isAuthenticated$);
const userData = createMemo(() => userDataObj()?.userData ?? {});
const userData = from(userData$);
const checkAuthResultEvent = isBasicAuth
const checkAuthResultEvent$ = isBasicAuth
? NEVER
: injector.get(CHECK_AUTH_RESULT_EVENT);
return {
oidcSecurityService,
isAuthenticated$,
isAuthenticated,
userData$,
userData,
injector,
checkAuthResultEvent,
checkAuthResultEvent$,
};
}

9
apps/webui/src/components/layout/app-layout.tsx
View File

@ -94,9 +94,9 @@ export function AppAside(props: AppAsideProps) {
return (
<>
{index() > 0 && (
<Show when={index() > 0}>
<BreadcrumbSeparator class="hidden md:block" />
)}
</Show>
<BreadcrumbItem class="hidden md:block">
<BreadcrumbLink
class="text-[var(--foreground)] hover:text-inherit"
@ -117,7 +117,10 @@ export function AppAside(props: AppAsideProps) {
</Show>
</div>
</header>
<div {...other} class={cn('min-h-0 flex-1 p-4 pt-0', local.class)}>
<div
{...other}
class={cn('flex min-h-0 flex-1 flex-col p-4 pt-0', local.class)}
>
{local.children}
</div>
</SidebarInset>

2
apps/webui/src/components/layout/app-not-found.tsx
View File

@ -21,7 +21,7 @@ export function guardRouteIndexAsNotFound(
export function AppNotFoundComponent() {
return (
<div class="flex min-h-screen items-center px-4 py-12 sm:px-6 md:px-8 lg:px-12 xl:px-16">
<div class="flex h-svh items-center px-4 py-12 sm:px-6 md:px-8 lg:px-12 xl:px-16">
<div class="w-full space-y-6 text-center">
<div class="space-y-3">
<h1 class="font-bold text-4xl tracking-tighter sm:text-5xl">

84
apps/webui/src/components/layout/app-sidebar.tsx
View File

@ -1,10 +1,3 @@
import {
BookOpen,
Folders,
Settings2,
SquareTerminal,
Telescope,
} from 'lucide-solid';
import type { ComponentProps } from 'solid-js';
import {
Sidebar,
@ -13,84 +6,11 @@ import {
SidebarHeader,
SidebarRail,
} from '~/components/ui/sidebar';
import { AppNavMainData } from '~/config/app-layout';
import { AppIcon } from './app-icon';
import { NavMain } from './nav-main';
import { NavUser } from './nav-user';
const navMain = [
{
group: 'Dashboard',
items: [
{
title: 'Explore',
link: {
to: '/explore',
},
icon: Telescope,
},
{
title: 'Subscriptions',
link: {
to: '/subscriptions',
},
icon: Folders,
children: [
{
title: 'Manage',
link: {
to: '/subscriptions/manage',
},
},
{
title: 'Create',
link: {
to: '/subscriptions/create',
},
},
],
},
{
title: 'Playground',
icon: SquareTerminal,
link: {
to: '/playground',
},
children: [
{
title: 'GraphQL Api',
link: {
to: '/playground/graphql-api',
},
},
],
},
{
title: 'Documentation',
link: {
href: 'https://github.com/dumtruck/konobangu/wiki',
target: '_blank',
},
icon: BookOpen,
},
{
title: 'Settings',
link: {
to: '/settings',
},
icon: Settings2,
children: [
{
title: 'Downloader',
link: {
to: '/settings/downloader',
},
},
],
},
],
},
];
const data = {
user: {
name: 'shadcn',
@ -108,7 +28,7 @@ export const AppSidebar = (props: AppSidebarRootProps) => {
<AppIcon />
</SidebarHeader>
<SidebarContent>
<NavMain groups={navMain} />
<NavMain groups={AppNavMainData} />
</SidebarContent>
<SidebarFooter>
<NavUser user={data.user} />

6
apps/webui/src/components/layout/app-skeleton.tsx
View File

@ -1,12 +1,12 @@
export function AppSkeleton() {
return (
<>
<div class="flex min-h-svh flex-1 flex-col gap-4 md:min-h-0">
<div class="grid auto-rows-min gap-4 md:grid-cols-3">
<div class="aspect-video rounded-xl bg-muted/50" />
<div class="aspect-video rounded-xl bg-muted/50" />
<div class="aspect-video rounded-xl bg-muted/50" />
</div>
<div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min" />
</>
<div class="min-h-svh flex-1 rounded-xl bg-muted/50 md:min-h-0" />
</div>
);
}

92
apps/webui/src/config/app-layout.ts Normal file
View File

@ -0,0 +1,92 @@
import {
BookOpen,
Folders,
Settings2,
SquareTerminal,
Telescope,
} from 'lucide-solid';
export const AppNavMainData = [
{
group: 'Dashboard',
items: [
{
title: 'Explore',
icon: Telescope,
children: [
{
title: 'Feed',
link: {
to: '/feed',
},
},
{
title: 'Explore',
link: {
to: '/explore',
},
},
],
},
{
title: 'Subscriptions',
link: {
to: '/subscriptions',
},
icon: Folders,
children: [
{
title: 'Manage',
link: {
to: '/subscriptions/manage',
},
},
{
title: 'Create',
link: {
to: '/subscriptions/create',
},
},
],
},
{
title: 'Playground',
icon: SquareTerminal,
link: {
to: '/playground',
},
children: [
{
title: 'GraphQL Api',
link: {
to: '/playground/graphql-api',
},
},
],
},
{
title: 'Documentation',
link: {
href: 'https://github.com/dumtruck/konobangu/wiki',
target: '_blank',
},
icon: BookOpen,
},
{
title: 'Settings',
link: {
to: '/settings',
},
icon: Settings2,
children: [
{
title: 'Downloader',
link: {
to: '/settings/downloader',
},
},
],
},
],
},
];

203
apps/webui/src/routeTree.gen.ts
View File

@ -12,19 +12,21 @@
import { Route as rootRoute } from './routes/__root'
import { Route as AboutImport } from './routes/about'
import { Route as AppImport } from './routes/_app'
import { Route as R404Import } from './routes/404'
import { Route as AppRouteImport } from './routes/_app/route'
import { Route as IndexImport } from './routes/index'
import { Route as AuthSignUpImport } from './routes/auth/sign-up'
import { Route as AuthSignInImport } from './routes/auth/sign-in'
import { Route as AppExploreImport } from './routes/_app/explore'
import { Route as AppSubscriptionsRouteImport } from './routes/_app/subscriptions/route'
import { Route as AppSettingsRouteImport } from './routes/_app/settings/route'
import { Route as AppPlaygroundRouteImport } from './routes/_app/playground/route'
import { Route as AuthOidcCallbackImport } from './routes/auth/oidc/callback'
import { Route as AppSubscriptionsManageImport } from './routes/_app/subscriptions/manage'
import { Route as AppSubscriptionsCreateImport } from './routes/_app/subscriptions/create'
import { Route as AppSettingsDownloaderImport } from './routes/_app/settings/downloader'
import { Route as AppPlaygroundGraphqlApiImport } from './routes/_app/playground/graphql-api'
import { Route as AppExploreFeedImport } from './routes/_app/_explore/feed'
import { Route as AppExploreExploreImport } from './routes/_app/_explore/explore'
import { Route as AppSubscriptionsEditSubscriptionIdImport } from './routes/_app/subscriptions/edit.$subscription-id'
// Create/Update Routes
@ -35,17 +37,17 @@ const AboutRoute = AboutImport.update({
getParentRoute: () => rootRoute,
} as any)
const AppRoute = AppImport.update({
id: '/_app',
getParentRoute: () => rootRoute,
} as any)
const R404Route = R404Import.update({
id: '/404',
path: '/404',
getParentRoute: () => rootRoute,
} as any)
const AppRouteRoute = AppRouteImport.update({
id: '/_app',
getParentRoute: () => rootRoute,
} as any)
const IndexRoute = IndexImport.update({
id: '/',
path: '/',
@ -64,28 +66,22 @@ const AuthSignInRoute = AuthSignInImport.update({
getParentRoute: () => rootRoute,
} as any)
const AppExploreRoute = AppExploreImport.update({
id: '/explore',
path: '/explore',
getParentRoute: () => AppRoute,
} as any)
const AppSubscriptionsRouteRoute = AppSubscriptionsRouteImport.update({
id: '/subscriptions',
path: '/subscriptions',
getParentRoute: () => AppRoute,
getParentRoute: () => AppRouteRoute,
} as any)
const AppSettingsRouteRoute = AppSettingsRouteImport.update({
id: '/settings',
path: '/settings',
getParentRoute: () => AppRoute,
getParentRoute: () => AppRouteRoute,
} as any)
const AppPlaygroundRouteRoute = AppPlaygroundRouteImport.update({
id: '/playground',
path: '/playground',
getParentRoute: () => AppRoute,
getParentRoute: () => AppRouteRoute,
} as any)
const AuthOidcCallbackRoute = AuthOidcCallbackImport.update({
@ -106,6 +102,12 @@ const AppSubscriptionsCreateRoute = AppSubscriptionsCreateImport.update({
getParentRoute: () => AppSubscriptionsRouteRoute,
} as any)
const AppSettingsDownloaderRoute = AppSettingsDownloaderImport.update({
id: '/downloader',
path: '/downloader',
getParentRoute: () => AppSettingsRouteRoute,
} as any)
const AppPlaygroundGraphqlApiRoute = AppPlaygroundGraphqlApiImport.update({
id: '/graphql-api',
path: '/graphql-api',
@ -114,6 +116,18 @@ const AppPlaygroundGraphqlApiRoute = AppPlaygroundGraphqlApiImport.update({
import('./routes/_app/playground/graphql-api.lazy').then((d) => d.Route),
)
const AppExploreFeedRoute = AppExploreFeedImport.update({
id: '/_explore/feed',
path: '/feed',
getParentRoute: () => AppRouteRoute,
} as any)
const AppExploreExploreRoute = AppExploreExploreImport.update({
id: '/_explore/explore',
path: '/explore',
getParentRoute: () => AppRouteRoute,
} as any)
const AppSubscriptionsEditSubscriptionIdRoute =
AppSubscriptionsEditSubscriptionIdImport.update({
id: '/edit/$subscription-id',
@ -132,6 +146,13 @@ declare module '@tanstack/solid-router' {
preLoaderRoute: typeof IndexImport
parentRoute: typeof rootRoute
}
'/_app': {
id: '/_app'
path: ''
fullPath: ''
preLoaderRoute: typeof AppRouteImport
parentRoute: typeof rootRoute
}
'/404': {
id: '/404'
path: '/404'
@ -139,13 +160,6 @@ declare module '@tanstack/solid-router' {
preLoaderRoute: typeof R404Import
parentRoute: typeof rootRoute
}
'/_app': {
id: '/_app'
path: ''
fullPath: ''
preLoaderRoute: typeof AppImport
parentRoute: typeof rootRoute
}
'/about': {
id: '/about'
path: '/about'
@ -158,28 +172,21 @@ declare module '@tanstack/solid-router' {
path: '/playground'
fullPath: '/playground'
preLoaderRoute: typeof AppPlaygroundRouteImport
parentRoute: typeof AppImport
parentRoute: typeof AppRouteImport
}
'/_app/settings': {
id: '/_app/settings'
path: '/settings'
fullPath: '/settings'
preLoaderRoute: typeof AppSettingsRouteImport
parentRoute: typeof AppImport
parentRoute: typeof AppRouteImport
}
'/_app/subscriptions': {
id: '/_app/subscriptions'
path: '/subscriptions'
fullPath: '/subscriptions'
preLoaderRoute: typeof AppSubscriptionsRouteImport
parentRoute: typeof AppImport
}
'/_app/explore': {
id: '/_app/explore'
path: '/explore'
fullPath: '/explore'
preLoaderRoute: typeof AppExploreImport
parentRoute: typeof AppImport
parentRoute: typeof AppRouteImport
}
'/auth/sign-in': {
id: '/auth/sign-in'
@ -195,6 +202,20 @@ declare module '@tanstack/solid-router' {
preLoaderRoute: typeof AuthSignUpImport
parentRoute: typeof rootRoute
}
'/_app/_explore/explore': {
id: '/_app/_explore/explore'
path: '/explore'
fullPath: '/explore'
preLoaderRoute: typeof AppExploreExploreImport
parentRoute: typeof AppRouteImport
}
'/_app/_explore/feed': {
id: '/_app/_explore/feed'
path: '/feed'
fullPath: '/feed'
preLoaderRoute: typeof AppExploreFeedImport
parentRoute: typeof AppRouteImport
}
'/_app/playground/graphql-api': {
id: '/_app/playground/graphql-api'
path: '/graphql-api'
@ -202,6 +223,13 @@ declare module '@tanstack/solid-router' {
preLoaderRoute: typeof AppPlaygroundGraphqlApiImport
parentRoute: typeof AppPlaygroundRouteImport
}
'/_app/settings/downloader': {
id: '/_app/settings/downloader'
path: '/downloader'
fullPath: '/settings/downloader'
preLoaderRoute: typeof AppSettingsDownloaderImport
parentRoute: typeof AppSettingsRouteImport
}
'/_app/subscriptions/create': {
id: '/_app/subscriptions/create'
path: '/create'
@ -246,6 +274,17 @@ const AppPlaygroundRouteRouteChildren: AppPlaygroundRouteRouteChildren = {
const AppPlaygroundRouteRouteWithChildren =
AppPlaygroundRouteRoute._addFileChildren(AppPlaygroundRouteRouteChildren)
interface AppSettingsRouteRouteChildren {
AppSettingsDownloaderRoute: typeof AppSettingsDownloaderRoute
}
const AppSettingsRouteRouteChildren: AppSettingsRouteRouteChildren = {
AppSettingsDownloaderRoute: AppSettingsDownloaderRoute,
}
const AppSettingsRouteRouteWithChildren =
AppSettingsRouteRoute._addFileChildren(AppSettingsRouteRouteChildren)
interface AppSubscriptionsRouteRouteChildren {
AppSubscriptionsCreateRoute: typeof AppSubscriptionsCreateRoute
AppSubscriptionsManageRoute: typeof AppSubscriptionsManageRoute
@ -264,34 +303,40 @@ const AppSubscriptionsRouteRouteWithChildren =
AppSubscriptionsRouteRouteChildren,
)
interface AppRouteChildren {
interface AppRouteRouteChildren {
AppPlaygroundRouteRoute: typeof AppPlaygroundRouteRouteWithChildren
AppSettingsRouteRoute: typeof AppSettingsRouteRoute
AppSettingsRouteRoute: typeof AppSettingsRouteRouteWithChildren
AppSubscriptionsRouteRoute: typeof AppSubscriptionsRouteRouteWithChildren
AppExploreRoute: typeof AppExploreRoute
AppExploreExploreRoute: typeof AppExploreExploreRoute
AppExploreFeedRoute: typeof AppExploreFeedRoute
}
const AppRouteChildren: AppRouteChildren = {
const AppRouteRouteChildren: AppRouteRouteChildren = {
AppPlaygroundRouteRoute: AppPlaygroundRouteRouteWithChildren,
AppSettingsRouteRoute: AppSettingsRouteRoute,
AppSettingsRouteRoute: AppSettingsRouteRouteWithChildren,
AppSubscriptionsRouteRoute: AppSubscriptionsRouteRouteWithChildren,
AppExploreRoute: AppExploreRoute,
AppExploreExploreRoute: AppExploreExploreRoute,
AppExploreFeedRoute: AppExploreFeedRoute,
}
const AppRouteWithChildren = AppRoute._addFileChildren(AppRouteChildren)
const AppRouteRouteWithChildren = AppRouteRoute._addFileChildren(
AppRouteRouteChildren,
)
export interface FileRoutesByFullPath {
'/': typeof IndexRoute
'': typeof AppRouteRouteWithChildren
'/404': typeof R404Route
'': typeof AppRouteWithChildren
'/about': typeof AboutRoute
'/playground': typeof AppPlaygroundRouteRouteWithChildren
'/settings': typeof AppSettingsRouteRoute
'/settings': typeof AppSettingsRouteRouteWithChildren
'/subscriptions': typeof AppSubscriptionsRouteRouteWithChildren
'/explore': typeof AppExploreRoute
'/auth/sign-in': typeof AuthSignInRoute
'/auth/sign-up': typeof AuthSignUpRoute
'/explore': typeof AppExploreExploreRoute
'/feed': typeof AppExploreFeedRoute
'/playground/graphql-api': typeof AppPlaygroundGraphqlApiRoute
'/settings/downloader': typeof AppSettingsDownloaderRoute
'/subscriptions/create': typeof AppSubscriptionsCreateRoute
'/subscriptions/manage': typeof AppSubscriptionsManageRoute
'/auth/oidc/callback': typeof AuthOidcCallbackRoute
@ -300,16 +345,18 @@ export interface FileRoutesByFullPath {
export interface FileRoutesByTo {
'/': typeof IndexRoute
'': typeof AppRouteRouteWithChildren
'/404': typeof R404Route
'': typeof AppRouteWithChildren
'/about': typeof AboutRoute
'/playground': typeof AppPlaygroundRouteRouteWithChildren
'/settings': typeof AppSettingsRouteRoute
'/settings': typeof AppSettingsRouteRouteWithChildren
'/subscriptions': typeof AppSubscriptionsRouteRouteWithChildren
'/explore': typeof AppExploreRoute
'/auth/sign-in': typeof AuthSignInRoute
'/auth/sign-up': typeof AuthSignUpRoute
'/explore': typeof AppExploreExploreRoute
'/feed': typeof AppExploreFeedRoute
'/playground/graphql-api': typeof AppPlaygroundGraphqlApiRoute
'/settings/downloader': typeof AppSettingsDownloaderRoute
'/subscriptions/create': typeof AppSubscriptionsCreateRoute
'/subscriptions/manage': typeof AppSubscriptionsManageRoute
'/auth/oidc/callback': typeof AuthOidcCallbackRoute
@ -319,16 +366,18 @@ export interface FileRoutesByTo {
export interface FileRoutesById {
__root__: typeof rootRoute
'/': typeof IndexRoute
'/_app': typeof AppRouteRouteWithChildren
'/404': typeof R404Route
'/_app': typeof AppRouteWithChildren
'/about': typeof AboutRoute
'/_app/playground': typeof AppPlaygroundRouteRouteWithChildren
'/_app/settings': typeof AppSettingsRouteRoute
'/_app/settings': typeof AppSettingsRouteRouteWithChildren
'/_app/subscriptions': typeof AppSubscriptionsRouteRouteWithChildren
'/_app/explore': typeof AppExploreRoute
'/auth/sign-in': typeof AuthSignInRoute
'/auth/sign-up': typeof AuthSignUpRoute
'/_app/_explore/explore': typeof AppExploreExploreRoute
'/_app/_explore/feed': typeof AppExploreFeedRoute
'/_app/playground/graphql-api': typeof AppPlaygroundGraphqlApiRoute
'/_app/settings/downloader': typeof AppSettingsDownloaderRoute
'/_app/subscriptions/create': typeof AppSubscriptionsCreateRoute
'/_app/subscriptions/manage': typeof AppSubscriptionsManageRoute
'/auth/oidc/callback': typeof AuthOidcCallbackRoute
@ -339,16 +388,18 @@ export interface FileRouteTypes {
fileRoutesByFullPath: FileRoutesByFullPath
fullPaths:
| '/'
| '/404'
| ''
| '/404'
| '/about'
| '/playground'
| '/settings'
| '/subscriptions'
| '/explore'
| '/auth/sign-in'
| '/auth/sign-up'
| '/explore'
| '/feed'
| '/playground/graphql-api'
| '/settings/downloader'
| '/subscriptions/create'
| '/subscriptions/manage'
| '/auth/oidc/callback'
@ -356,16 +407,18 @@ export interface FileRouteTypes {
fileRoutesByTo: FileRoutesByTo
to:
| '/'
| '/404'
| ''
| '/404'
| '/about'
| '/playground'
| '/settings'
| '/subscriptions'
| '/explore'
| '/auth/sign-in'
| '/auth/sign-up'
| '/explore'
| '/feed'
| '/playground/graphql-api'
| '/settings/downloader'
| '/subscriptions/create'
| '/subscriptions/manage'
| '/auth/oidc/callback'
@ -373,16 +426,18 @@ export interface FileRouteTypes {
id:
| '__root__'
| '/'
| '/404'
| '/_app'
| '/404'
| '/about'
| '/_app/playground'
| '/_app/settings'
| '/_app/subscriptions'
| '/_app/explore'
| '/auth/sign-in'
| '/auth/sign-up'
| '/_app/_explore/explore'
| '/_app/_explore/feed'
| '/_app/playground/graphql-api'
| '/_app/settings/downloader'
| '/_app/subscriptions/create'
| '/_app/subscriptions/manage'
| '/auth/oidc/callback'
@ -392,8 +447,8 @@ export interface FileRouteTypes {
export interface RootRouteChildren {
IndexRoute: typeof IndexRoute
AppRouteRoute: typeof AppRouteRouteWithChildren
R404Route: typeof R404Route
AppRoute: typeof AppRouteWithChildren
AboutRoute: typeof AboutRoute
AuthSignInRoute: typeof AuthSignInRoute
AuthSignUpRoute: typeof AuthSignUpRoute
@ -402,8 +457,8 @@ export interface RootRouteChildren {
const rootRouteChildren: RootRouteChildren = {
IndexRoute: IndexRoute,
AppRouteRoute: AppRouteRouteWithChildren,
R404Route: R404Route,
AppRoute: AppRouteWithChildren,
AboutRoute: AboutRoute,
AuthSignInRoute: AuthSignInRoute,
AuthSignUpRoute: AuthSignUpRoute,
@ -421,8 +476,8 @@ export const routeTree = rootRoute
"filePath": "__root.tsx",
"children": [
"/",
"/404",
"/_app",
"/404",
"/about",
"/auth/sign-in",
"/auth/sign-up",
@ -432,18 +487,19 @@ export const routeTree = rootRoute
"/": {
"filePath": "index.tsx"
},
"/404": {
"filePath": "404.tsx"
},
"/_app": {
"filePath": "_app.tsx",
"filePath": "_app/route.tsx",
"children": [
"/_app/playground",
"/_app/settings",
"/_app/subscriptions",
"/_app/explore"
"/_app/_explore/explore",
"/_app/_explore/feed"
]
},
"/404": {
"filePath": "404.tsx"
},
"/about": {
"filePath": "about.tsx"
},
@ -456,7 +512,10 @@ export const routeTree = rootRoute
},
"/_app/settings": {
"filePath": "_app/settings/route.tsx",
"parent": "/_app"
"parent": "/_app",
"children": [
"/_app/settings/downloader"
]
},
"/_app/subscriptions": {
"filePath": "_app/subscriptions/route.tsx",
@ -467,20 +526,28 @@ export const routeTree = rootRoute
"/_app/subscriptions/edit/$subscription-id"
]
},
"/_app/explore": {
"filePath": "_app/explore.tsx",
"parent": "/_app"
},
"/auth/sign-in": {
"filePath": "auth/sign-in.tsx"
},
"/auth/sign-up": {
"filePath": "auth/sign-up.tsx"
},
"/_app/_explore/explore": {
"filePath": "_app/_explore/explore.tsx",
"parent": "/_app"
},
"/_app/_explore/feed": {
"filePath": "_app/_explore/feed.tsx",
"parent": "/_app"
},
"/_app/playground/graphql-api": {
"filePath": "_app/playground/graphql-api.tsx",
"parent": "/_app/playground"
},
"/_app/settings/downloader": {
"filePath": "_app/settings/downloader.tsx",
"parent": "/_app/settings"
},
"/_app/subscriptions/create": {
"filePath": "_app/subscriptions/create.tsx",
"parent": "/_app/subscriptions"

2
apps/webui/src/routes/_app/explore.tsx → apps/webui/src/routes/_app/_explore/explore.tsx
View File

@ -1,7 +1,7 @@
import { createFileRoute } from '@tanstack/solid-router';
import type { RouteStateDataOption } from '~/traits/router';
export const Route = createFileRoute('/_app/explore')({
export const Route = createFileRoute('/_app/_explore/explore')({
component: ExploreRouteComponent,
staticData: {
breadcrumb: {

15
apps/webui/src/routes/_app/_explore/feed.tsx Normal file
View File

@ -0,0 +1,15 @@
import { createFileRoute } from '@tanstack/solid-router';
import type { RouteStateDataOption } from '~/traits/router';
export const Route = createFileRoute('/_app/_explore/feed')({
component: FeedRouteComponent,
staticData: {
breadcrumb: {
label: 'Feed',
},
} satisfies RouteStateDataOption,
});
function FeedRouteComponent() {
return <div>Hello "/_app/feed"!</div>;
}

8
apps/webui/src/routes/_app/playground/graphql-api.lazy.tsx
View File

@ -1,7 +1,7 @@
import { type Fetcher, createGraphiQLFetcher } from '@graphiql/toolkit';
import { createLazyFileRoute } from '@tanstack/solid-router';
import GraphiQL from 'graphiql';
import React from 'react';
import { createElement } from 'react';
import { createRoot } from 'react-dom/client';
import { onCleanup, onMount } from 'solid-js';
import { isOidcAuth } from '~/auth/config';
@ -34,10 +34,10 @@ function PlaygroundGraphQLApiRouteComponent() {
: undefined,
})(props);
};
const g = React.createElement(GraphiQL, {
const graphiql = createElement(GraphiQL, {
fetcher,
});
reactRoot.render(g);
reactRoot.render(graphiql);
onCleanup(() => reactRoot.unmount());
}
@ -47,7 +47,7 @@ function PlaygroundGraphQLApiRouteComponent() {
return (
<div
data-id="graphiql-playground-container"
class="h-full"
class="h-full overflow-hidden rounded-lg"
ref={containerRef}
/>
);

2
apps/webui/src/routes/_app/playground/graphql-api.tsx
View File

@ -1,6 +1,8 @@
import { createFileRoute } from '@tanstack/solid-router';
import { AppSkeleton } from '~/components/layout/app-skeleton';
import { buildLeafRouteStaticData } from '~/utils/route';
export const Route = createFileRoute('/_app/playground/graphql-api')({
staticData: buildLeafRouteStaticData({ title: 'GraphQL Api' }),
pendingComponent: AppSkeleton,
});

0
apps/webui/src/routes/_app.tsx → apps/webui/src/routes/_app/route.tsx
View File

13
apps/webui/src/routes/_app/settings/downloader.tsx Normal file
View File

@ -0,0 +1,13 @@
import { createFileRoute } from '@tanstack/solid-router';
import { buildLeafRouteStaticData } from '~/utils/route';
export const Route = createFileRoute('/_app/settings/downloader')({
component: SettingsDownloaderRouteComponent,
staticData: buildLeafRouteStaticData({
title: 'Downloader',
}),
});
function SettingsDownloaderRouteComponent() {
return <div>Hello "/_app/settings/downloader"!</div>;
}

81
apps/webui/src/routes/auth/oidc/callback.tsx
View File

@ -1,9 +1,80 @@
import { createFileRoute } from '@tanstack/solid-router'
import { createFileRoute } from '@tanstack/solid-router';
import { EventTypes } from 'oidc-client-rx';
import { filter, map } from 'rxjs';
import { Match, Switch, from } from 'solid-js';
import { isOidcAuth } from '~/auth/config';
import { useAuth } from '~/auth/hooks';
import { ProLink } from '~/components/ui/pro-link';
import { Spinner } from '~/components/ui/spinner';
export const Route = createFileRoute('/auth/oidc/callback')({
component: RouteComponent,
})
component: OidcCallbackRouteComponent,
});
function RouteComponent() {
return <div>Hello "/auth/oidc/callback"!</div>
function OidcCallbackRouteComponent() {
const auth = useAuth();
const isLoading = from(auth.checkAuthResultEvent$.pipe(map(Boolean)));
const checkAuthResultError = from(
auth.checkAuthResultEvent$.pipe(
filter(
(
e
): e is {
type: EventTypes.CheckingAuthFinishedWithError;
value: string;
} => e.type === EventTypes.CheckingAuthFinishedWithError
),
map((e) => e.value)
)
);
const renderBackToHome = () => {
return (
<ProLink
to="/"
class="inline-flex h-10 items-center rounded-md border border-gray-200 border-gray-200 bg-white px-8 font-medium text-sm shadow-sm transition-colors hover:bg-gray-100 hover:text-gray-900 dark:border-gray-800 dark:border-gray-800 dark:bg-gray-950 dark:focus-visible:ring-gray-300 dark:hover:bg-gray-800 dark:hover:text-gray-50"
>
Return to website
</ProLink>
);
};
return (
<div class="flex h-svh items-center px-4 py-12 sm:px-6 md:px-8 lg:px-12 xl:px-16">
<div class="w-full space-y-6 text-center">
<div class="space-y-6">
<div class="flex justify-center font-bold text-4xl tracking-tighter sm:text-5xl">
<Spinner variant="circle-filled" size="48" />
</div>
{isOidcAuth ? (
<Switch
fallback={
<p class="text-gray-500">
Succeed to handle OIDC authentication callback.
</p>
}
>
<Match when={isLoading()}>
<p class="text-gray-500">
Processing OIDC authentication callback...
</p>
</Match>
<Match when={!!checkAuthResultError()}>
<p class="text-gray-500">
Failed to handle OIDC callback: {checkAuthResultError()}
</p>
</Match>
</Switch>
) : (
<p class="text-gray-500">
Error: Current authentication method is not OIDC!
</p>
)}
{renderBackToHome()}
</div>
</div>
</div>
);
}

2
apps/webui/src/routes/index.tsx
View File

@ -8,7 +8,7 @@ export const Route = createFileRoute('/')({
function HomeRouteComponent() {
return (
<AppAside class="flex flex-1 flex-col gap-4" extractBreadcrumbFromRoutes>
<AppAside extractBreadcrumbFromRoutes>
<AppSkeleton />
</AppAside>
);

2
apps/webui/src/utils/route/index.ts
View File

@ -1,4 +1,4 @@
import { FileRoutesByPath, Outlet } from '@tanstack/solid-router';
import { Outlet } from '@tanstack/solid-router';
import { guardRouteIndexAsNotFound } from '~/components/layout/app-not-found';
import type { RouteStateDataOption } from '~/traits/router';

1146
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff