refactor: merge playground into webui

apps/recorder/src/web/controller/__root.tsx

@@ -1,32 +0,0 @@
-import type { Injector } from '@outposts/injection-js';
-import {
-  Outlet,
-  createRootRouteWithContext,
-} from '@tanstack/react-router';
-import { TanStackRouterDevtools } from '@tanstack/router-devtools';
-import type { OidcSecurityService } from 'oidc-client-rx';
-
-export type RouterContext =
-  | {
-      isAuthenticated: false;
-      injector: Injector;
-      oidcSecurityService: OidcSecurityService;
-    }
-  | {
-      isAuthenticated: true;
-      injector?: Injector;
-      oidcSecurityService?: OidcSecurityService;
-    };
-
-export const Route = createRootRouteWithContext<RouterContext>()({
-  component: RootComponent,
-});
-
-function RootComponent() {
-  return (
-    <>
-      <Outlet />
-      <TanStackRouterDevtools position="bottom-right" />
-    </>
-  );
-}

apps/recorder/src/web/controller/graphql/index.tsx

@@ -1,36 +0,0 @@
-import { type Fetcher, createGraphiQLFetcher } from '@graphiql/toolkit';
-import { createFileRoute } from '@tanstack/react-router';
-import GraphiQL from 'graphiql';
-import { useMemo } from 'react';
-import { firstValueFrom } from 'rxjs';
-import { beforeLoadGuard } from '../../../auth/guard';
-import { useAuth } from '../../../auth/hooks';
-import 'graphiql/graphiql.css';
-
-export const Route = createFileRoute('/graphql/')({
-  component: RouteComponent,
-  beforeLoad: beforeLoadGuard,
-});
-
-function RouteComponent() {
-  const { oidcSecurityService } = useAuth();
-
-  const fetcher = useMemo(
-    (): Fetcher => async (props) => {
-      const accessToken = oidcSecurityService
-        ? await firstValueFrom(oidcSecurityService.getAccessToken())
-        : undefined;
-      return createGraphiQLFetcher({
-        url: '/api/graphql',
-        headers: accessToken
-          ? {
-              Authorization: `Bearer ${accessToken}`,
-            }
-          : undefined,
-      })(props);
-    },
-    [oidcSecurityService]
-  );
-
-  return <GraphiQL fetcher={fetcher} className="!h-svh" />;
-}

apps/recorder/src/web/controller/index.tsx

@@ -1,9 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/')({
-  component: RouteComponent,
-})
-
-function RouteComponent() {
-  return <div>Hello to playground!</div>
-}

apps/recorder/src/web/controller/oidc/callback.tsx

@@ -1,32 +0,0 @@
-import { createFileRoute, redirect } from '@tanstack/react-router';
-import { EventTypes } from 'oidc-client-rx';
-import { useAuth } from '../../../auth/hooks';
-
-export const Route = createFileRoute('/oidc/callback')({
-  component: RouteComponent,
-  beforeLoad: ({ context }) => {
-    if (!context.oidcSecurityService) {
-      throw redirect({
-        to: '/',
-      });
-    }
-  },
-});
-
-function RouteComponent() {
-  const auth = useAuth();
-
-  if (!auth.checkAuthResultEvent) {
-    return <div>Loading...</div>;
-  }
-
-  return (
-    <div>
-      OpenID Connect Auth Callback:{' '}
-      {auth.checkAuthResultEvent?.type ===
-      EventTypes.CheckingAuthFinishedWithError
-        ? auth.checkAuthResultEvent.value
-        : 'success'}
-    </div>
-  );
-}