@qlover/create-app 0.7.13 → 0.7.15

package/dist/templates/next-app/src/app/api/ai/completions/route.ts

@@ -0,0 +1,32 @@
+import { ExecutorError } from '@qlover/fe-corekit';
+import { NextResponse } from 'next/server';
+import { BootstrapServer } from '@/core/bootstraps/BootstrapServer';
+import { AppErrorApi } from '@/server/AppErrorApi';
+import { AppSuccessApi } from '@/server/AppSuccessApi';
+import { AIService } from '@/server/services/AIService';
+
+export async function GET() {
+  const server = new BootstrapServer();
+
+  const result = await server.execNoError(async ({ parameters: { IOC } }) => {
+    // const requestBody = await req.json();
+
+    const result = await IOC(AIService).completions([
+      {
+        role: 'user',
+        content: 'hello'
+      }
+    ]);
+
+    return result;
+  });
+
+  if (result instanceof ExecutorError) {
+    console.log(result);
+    return NextResponse.json(new AppErrorApi(result.id, result.message), {
+      status: 400
+    });
+  }
+
+  return NextResponse.json(new AppSuccessApi(result));
+}

package/dist/templates/next-app/src/base/cases/AppConfig.ts

@@ -31,4 +31,7 @@ export class AppConfig implements EnvConfigInterface {
    * @example '1 year'
    */
   readonly jwtExpiresIn: StringValue = '30 days';
+
+  readonly openaiBaseUrl: string = process.env.CEREBRAS_BASE_URL!;
+  readonly openaiApiKey: string = process.env.CEREBRAS_API_KEY!;
 }

package/dist/templates/next-app/src/base/cases/ChatAction.ts

@@ -0,0 +1,21 @@
+import { injectable } from 'inversify';
+import {
+  ChatActionInterface,
+  type MessageInterface,
+  type ChatStateInterface
+} from '@/uikit/components/chat/ChatActionInterface';
+
+class ChatState implements ChatStateInterface {
+  messages: MessageInterface[] = [];
+}
+
+@injectable()
+export class ChatAction extends ChatActionInterface<ChatStateInterface> {
+  constructor() {
+    super(() => new ChatState());
+  }
+
+  focus(): void {
+    console.log('focus');
+  }
+}

package/dist/templates/next-app/src/base/cases/FocusBarAction.ts

@@ -0,0 +1,36 @@
+import { injectable } from 'inversify';
+
+import type { FocusBarStateInterface } from '@/uikit/components/chat/FocusBarActionInterface';
+import { FocusBarActionInterface } from '@/uikit/components/chat/FocusBarActionInterface';
+import { RequestState } from './RequestState';
+
+class FocusBarState implements FocusBarStateInterface {
+  showHistoryArea = false;
+  inputValue = '';
+  sendState = new RequestState();
+}
+
+@injectable()
+export class FocusBarAction extends FocusBarActionInterface<FocusBarStateInterface> {
+  constructor() {
+    super(() => new FocusBarState());
+  }
+
+  sendMessage(_message: string): Promise<void> {
+    return new Promise((resolve) => {
+      this.emit(this.cloneState({ sendState: new RequestState(true) }));
+      setTimeout(() => {
+        this.emit(this.cloneState({ sendState: new RequestState().end() }));
+        resolve();
+      }, 1000);
+    });
+  }
+
+  setInputValue(value: string): void {
+    this.emit(this.cloneState({ inputValue: value }));
+  }
+
+  clearInput(): void {
+    this.emit(this.cloneState({ inputValue: '' }));
+  }
+}

package/dist/templates/next-app/src/base/port/AdminPageInterface.ts

@@ -1,6 +1,6 @@
 import { StoreInterface } from '@qlover/corekit-bridge';
 import { RequestState } from '../cases/RequestState';
-import type { PaginationInterface } from './PaginationInterface';
+import type { PaginationInterface } from '../../server/port/PaginationInterface';
 import type { StoreStateInterface } from '@qlover/corekit-bridge';
 
 export interface AdminPageListParams {
@@ -34,8 +34,6 @@ export abstract class AdminPageInterface<
     try {
       const result = await this.fetchList(this.state.listParams);
 
-      console.log('jj result', result);
-
       this.emit(
         this.cloneState({
           initState: new RequestState(false, result).end()

package/dist/templates/next-app/src/base/services/AdminUserService.ts

@@ -1,4 +1,5 @@
 import { inject, injectable } from 'inversify';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 import {
   AdminPageInterface,
   type AdminPageListParams,
@@ -6,7 +7,6 @@ import {
 } from '../port/AdminPageInterface';
 import { AdminUserApi } from './adminApi/AdminUserApi';
 import { RequestState } from '../cases/RequestState';
-import type { PaginationInterface } from '../port/PaginationInterface';
 
 @injectable()
 export class AdminUserService extends AdminPageInterface<AdminPageState> {

package/dist/templates/next-app/src/base/services/adminApi/AdminUserApi.ts

@@ -1,6 +1,6 @@
 import { inject, injectable } from 'inversify';
 import type { AdminPageListParams } from '@/base/port/AdminPageInterface';
-import type { PaginationInterface } from '@/base/port/PaginationInterface';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 import {
   AppApiRequester,
   type AppApiConfig,

package/dist/templates/next-app/src/base/services/appApi/AppApiPlugin.ts

@@ -6,10 +6,13 @@ import {
 } from '@qlover/fe-corekit';
 import type { AppApiErrorInterface } from '@/base/port/AppApiInterface';
 import type { AppApiConfig } from './AppApiRequester';
+import type { LoggerInterface } from '@qlover/logger';
 
 export class AppApiPlugin implements ExecutorPlugin {
   readonly pluginName = 'AppApiPlugin';
 
+  constructor(protected logger: LoggerInterface) {}
+
   isAppApiErrorInterface(value: unknown): value is AppApiErrorInterface {
     return (
       typeof value === 'object' &&
@@ -21,8 +24,16 @@ export class AppApiPlugin implements ExecutorPlugin {
     );
   }
 
-  onSuccess(context: ExecutorContext<unknown>): void | Promise<void> {
+  onSuccess(context: ExecutorContext<AppApiConfig>): void | Promise<void> {
     const response = context.returnValue;
+    const { parameters } = context;
+
+    this.logger.info(
+      `%c[AppApi ${parameters.method} ${parameters.url}]%c - ${new Date().toLocaleString()}`,
+      'color: #0f0;',
+      'color: inherit;',
+      response
+    );
 
     if (this.isAppApiErrorInterface(response)) {
       throw new Error(response.message || response.id);
@@ -34,6 +45,8 @@ export class AppApiPlugin implements ExecutorPlugin {
   ): Promise<ExecutorError | void> {
     const { error, parameters } = context;
 
+    this.loggerError(parameters, error);
+
     if (error instanceof RequestError && parameters.responseType === 'json') {
       // @ts-expect-error response is not defined in Error
       let response = error?.response;
@@ -60,4 +73,13 @@ export class AppApiPlugin implements ExecutorPlugin {
       return {};
     }
   }
+
+  protected loggerError(config: AppApiConfig, error: unknown): void {
+    this.logger.error(
+      `%c[AppApi ${config.method} ${config.url}]%c - ${new Date().toLocaleString()}`,
+      'color: #f00;',
+      'color: inherit;',
+      error
+    );
+  }
 }

package/dist/templates/next-app/src/base/services/appApi/AppUserApiBootstrap.ts

@@ -3,6 +3,7 @@ import { FetchURLPlugin } from '@qlover/fe-corekit';
 import { DialogErrorPlugin } from '@/base/cases/DialogErrorPlugin';
 import { RequestEncryptPlugin } from '@/base/cases/RequestEncryptPlugin';
 import { StringEncryptor } from '@/base/cases/StringEncryptor';
+import { I } from '@config/IOCIdentifier';
 import { AppApiPlugin } from './AppApiPlugin';
 import { AppApiRequester } from './AppApiRequester';
 import type { AppApiConfig } from './AppApiRequester';
@@ -27,9 +28,8 @@ export class AppUserApiBootstrap implements BootstrapExecutorPlugin {
         requestDataSerializer: this.requestDataSerializer.bind(this)
       })
     );
-    appUserApi.usePlugin(new AppApiPlugin());
+    appUserApi.usePlugin(new AppApiPlugin(ioc.get(I.Logger)));
     appUserApi.usePlugin(ioc.get(DialogErrorPlugin));
-    console.log('jj AppUserApiBootstrap success');
   }
 
   protected requestDataSerializer(

package/dist/templates/next-app/src/base/types/PageProps.ts

@@ -1,4 +1,4 @@
-import type { PageWithParams } from '@/base/cases/PageParams';
+import type { PageWithParams } from '@/server/PageParams';
 
 export interface PageParamsProps extends PageWithParams {
   searchParams: Promise<{ [key: string]: string | string[] | undefined }>;

package/dist/templates/next-app/src/core/bootstraps/BootstrapClient.ts

@@ -1,3 +1,4 @@
+import 'reflect-metadata';
 import { Bootstrap } from '@qlover/corekit-bridge';
 import { isObject } from 'lodash';
 import { browserGlobalsName } from '@config/common';

package/dist/templates/next-app/src/core/bootstraps/BootstrapServer.ts

@@ -1,3 +1,4 @@
+import 'reflect-metadata';
 import {
   type ServiceIdentifier,
   type BootstrapContextValue,

package/dist/templates/next-app/src/core/globals.ts

@@ -1,3 +1,5 @@
+import 'reflect-metadata';
+
 // ! global variables, don't import any dependencies and don't have side effects
 import { ColorFormatter, ConsoleHandler, Logger } from '@qlover/corekit-bridge';
 import { JSONSerializer } from '@qlover/fe-corekit';

package/dist/templates/next-app/src/core/serverIoc/ServerIOCRegister.ts

@@ -7,6 +7,7 @@ import {
   type IOCRegisterInterface
 } from '@qlover/corekit-bridge';
 import type { IocRegisterOptions } from '@/base/port/IOCInterface';
+import { SupabaseBridge } from '@/server/sqlBridges/SupabaseBridge';
 import { IOCIdentifier as I } from '@config/IOCIdentifier';
 
 export class ServerIOCRegister
@@ -45,7 +46,9 @@ export class ServerIOCRegister
     );
   }
 
-  protected registerImplement(_ioc: IOCContainerInterface): void {}
+  protected registerImplement(ioc: IOCContainerInterface): void {
+    ioc.bind(I.DBBridgeInterface, ioc.get(SupabaseBridge));
+  }
 
   protected registerCommon(_ioc: IOCContainerInterface): void {}
 

package/dist/templates/next-app/src/{base/cases → server}/PageParams.ts

@@ -2,7 +2,7 @@ import { notFound } from 'next/navigation';
 import { getMessages, getTranslations } from 'next-intl/server';
 import { i18nConfig } from '@config/i18n';
 import type { LocaleType, PageI18nInterface } from '@config/i18n';
-import type { ParamsHandlerInterface as ParamsHandlerInterface } from '../port/ParamsHandlerInterface';
+import type { ParamsHandlerInterface as ParamsHandlerInterface } from './port/ParamsHandlerInterface';
 
 export interface PageWithParams {
   params?: Promise<PageParamsType>;

package/dist/templates/next-app/src/server/port/DBBridgeInterface.ts

@@ -0,0 +1,31 @@
+export type WhereOperation = '=' | '!=' | '>' | '<' | '>=' | '<=';
+export type Where = [string, WhereOperation, string | number];
+
+export interface BridgeEvent {
+  table: string;
+  fields?: string | string[];
+  where?: Where[];
+  data?: unknown;
+  page?: number;
+  pageSize?: number;
+}
+
+export interface PaginationInfo {
+  total: number;
+  page: number;
+  pageSize: number;
+}
+
+export interface DBBridgeResponse<T> {
+  error?: unknown;
+  data: T;
+  pagination?: PaginationInfo;
+}
+
+export interface DBBridgeInterface {
+  add(event: BridgeEvent): Promise<DBBridgeResponse<unknown>>;
+  update(event: BridgeEvent): Promise<DBBridgeResponse<unknown>>;
+  delete(event: BridgeEvent): Promise<DBBridgeResponse<unknown>>;
+  get(event: BridgeEvent): Promise<DBBridgeResponse<unknown>>;
+  pagination(event: BridgeEvent): Promise<DBBridgeResponse<unknown[]>>;
+}

package/dist/templates/next-app/src/server/port/DBTableInterface.ts

@@ -1,4 +1,4 @@
-import type { PaginationInterface } from '@/base/port/PaginationInterface';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 
 export interface DBTableInterface {
   readonly name: string;

package/dist/templates/next-app/src/server/repositorys/UserRepository.ts

@@ -1,9 +1,9 @@
 import { inject, injectable } from 'inversify';
 import { isEmpty, last } from 'lodash';
-import type { DBBridgeInterface } from '@/base/port/DBBridgeInterface';
-import type { PaginationInterface } from '@/base/port/PaginationInterface';
+import type { DBBridgeInterface } from '@/server/port/DBBridgeInterface';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 import type { UserSchema } from '@migrations/schema/UserSchema';
-import { SupabaseBridge } from '../SupabaseBridge';
+import { I } from '@config/IOCIdentifier';
 import type { UserRepositoryInterface } from '../port/UserRepositoryInterface';
 
 @injectable()
@@ -21,7 +21,9 @@ export class UserRepository implements UserRepositoryInterface {
     'updated_at'
   ];
 
-  constructor(@inject(SupabaseBridge) protected dbBridge: DBBridgeInterface) {}
+  constructor(
+    @inject(I.DBBridgeInterface) protected dbBridge: DBBridgeInterface
+  ) {}
 
   getAll(): Promise<unknown> {
     return this.dbBridge.get({ table: this.name });

package/dist/templates/next-app/src/server/services/AIService.ts

@@ -0,0 +1,43 @@
+import { inject, injectable } from 'inversify';
+import OpenAI from 'openai';
+import type { AppConfig } from '@/base/cases/AppConfig';
+import { I } from '@config/IOCIdentifier';
+import type { ChatCompletionMessageParam } from 'openai/resources/chat/completions';
+
+@injectable()
+export class AIService {
+  protected apiKey: string;
+  protected baseUrl: string;
+  protected client: OpenAI;
+
+  constructor(@inject(I.AppConfig) appConfig: AppConfig) {
+    this.apiKey = appConfig.openaiApiKey;
+    this.baseUrl = appConfig.openaiBaseUrl;
+
+    console.log(this.apiKey, this.baseUrl);
+    this.client = new OpenAI({
+      apiKey: this.apiKey,
+      baseURL: this.baseUrl
+    });
+  }
+
+  async completions(messages: ChatCompletionMessageParam[]): Promise<unknown> {
+    const url = `${this.baseUrl}/chat/completions`;
+
+    const response = await fetch(url, {
+      method: 'POST',
+      body: JSON.stringify({
+        messages: messages,
+        model: 'claude-sonnet-4-20250514'
+      }),
+      headers: {
+        Authorization: `token ${this.apiKey}`,
+        'Content-Type': 'application/json',
+        Accept: 'application/json'
+      },
+      mode: 'cors'
+    });
+
+    return await response.json();
+  }
+}

package/dist/templates/next-app/src/server/services/ApiUserService.ts

@@ -1,5 +1,5 @@
 import { inject, injectable } from 'inversify';
-import type { PaginationInterface } from '@/base/port/PaginationInterface';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 import type { UserSchema } from '@migrations/schema/UserSchema';
 import { UserRepository } from '../repositorys/UserRepository';
 import { PaginationValidator } from '../validators/PaginationValidator';

package/dist/templates/next-app/src/server/{SupabaseBridge.ts → sqlBridges/SupabaseBridge.ts}

@@ -9,8 +9,9 @@ import type { AppConfig } from '@/base/cases/AppConfig';
 import type {
   BridgeEvent,
   DBBridgeInterface,
+  DBBridgeResponse,
   Where
-} from '@/base/port/DBBridgeInterface';
+} from '@/server/port/DBBridgeInterface';
 import { I } from '@config/IOCIdentifier';
 import type { LoggerInterface } from '@qlover/logger';
 import type { PostgrestFilterBuilder } from '@supabase/postgrest-js';
@@ -24,6 +25,9 @@ const whereHandlerMaps = {
   '<=': 'lte'
 };
 
+export type SupabaseBridgeResponse<T> = DBBridgeResponse<T> &
+  PostgrestResponse<T>;
+
 @injectable()
 export class SupabaseBridge implements DBBridgeInterface {
   protected supabase: SupabaseClient;
@@ -42,19 +46,20 @@ export class SupabaseBridge implements DBBridgeInterface {
     return this.supabase;
   }
 
-  async execSql(sql: string): Promise<PostgrestSingleResponse<unknown>> {
+  async execSql(sql: string): Promise<SupabaseBridgeResponse<unknown>> {
     const res = await this.supabase.rpc('exec_sql', { sql });
     return this.catch(res);
   }
 
   protected async catch(
     result: PostgrestSingleResponse<unknown>
-  ): Promise<PostgrestSingleResponse<unknown>> {
+  ): Promise<SupabaseBridgeResponse<unknown>> {
     if (result.error) {
       this.logger.info(result);
       throw new Error(result.error.message);
     }
-    return result;
+
+    return result as SupabaseBridgeResponse<unknown>;
   }
 
   protected handleWhere(
@@ -79,7 +84,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     }
   }
 
-  async add(event: BridgeEvent): Promise<PostgrestSingleResponse<unknown>> {
+  async add(event: BridgeEvent): Promise<DBBridgeResponse<unknown>> {
     const { table, data } = event;
     if (!data) {
       throw new Error('Data is required for add operation');
@@ -91,7 +96,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     return this.catch(res);
   }
 
-  async update(event: BridgeEvent): Promise<PostgrestSingleResponse<unknown>> {
+  async update(event: BridgeEvent): Promise<DBBridgeResponse<unknown>> {
     const { table, data, where } = event;
     if (!data) {
       throw new Error('Data is required for update operation');
@@ -104,7 +109,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     return this.catch(await handler);
   }
 
-  async delete(event: BridgeEvent): Promise<PostgrestSingleResponse<unknown>> {
+  async delete(event: BridgeEvent): Promise<DBBridgeResponse<unknown>> {
     const { table, where } = event;
     const handler = this.supabase.from(table).delete();
 
@@ -113,7 +118,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     return this.catch(await handler);
   }
 
-  async get(event: BridgeEvent): Promise<PostgrestSingleResponse<unknown>> {
+  async get(event: BridgeEvent): Promise<SupabaseBridgeResponse<unknown>> {
     const { table, fields = '*', where } = event;
     const selectFields = Array.isArray(fields) ? fields.join(',') : fields;
     const handler = this.supabase.from(table).select(selectFields);
@@ -123,7 +128,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     return this.catch(await handler);
   }
 
-  async pagination(event: BridgeEvent): Promise<PostgrestResponse<unknown>> {
+  async pagination(event: BridgeEvent): Promise<DBBridgeResponse<unknown[]>> {
     const { table, fields = '*', where, page = 1, pageSize = 10 } = event;
     const selectFields = Array.isArray(fields) ? fields.join(',') : fields;
 
@@ -145,7 +150,7 @@ export class SupabaseBridge implements DBBridgeInterface {
     const result = await this.catch(await handler);
 
     if (result.error) {
-      return result as PostgrestResponse<unknown>;
+      return result as DBBridgeResponse<unknown[]>;
     }
 
     return {
@@ -154,6 +159,6 @@ export class SupabaseBridge implements DBBridgeInterface {
       count: countResult.count,
       status: result.status,
       statusText: result.statusText
-    };
+    } as DBBridgeResponse<unknown[]>;
   }
 }

package/dist/templates/next-app/src/server/validators/LoginValidator.ts

@@ -17,13 +17,13 @@ export interface LoginValidatorData {
   password: string;
 }
 
-const emailSchema = z.email({ error: V_EMAIL_INVALID });
+const emailSchema = z.string().email({ message: V_EMAIL_INVALID });
 
 const passwordSchema = z
   .string()
-  .min(6, { error: V_PASSWORD_MIN_LENGTH })
-  .max(50, { error: V_PASSWORD_MAX_LENGTH })
-  .regex(/^\S+$/, { error: V_PASSWORD_SPECIAL_CHARS });
+  .min(6, { message: V_PASSWORD_MIN_LENGTH })
+  .max(50, { message: V_PASSWORD_MAX_LENGTH })
+  .regex(/^\S+$/, { message: V_PASSWORD_SPECIAL_CHARS });
 
 interface ExtendedExecutorError extends ExecutorError {
   issues?: ValidationFaildResult[];

package/dist/templates/next-app/src/server/validators/PaginationValidator.ts

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-import type { PaginationInterface } from '@/base/port/PaginationInterface';
+import type { PaginationInterface } from '@/server/port/PaginationInterface';
 import { API_PAGE_INVALID } from '@config/Identifier';
 import {
   type ValidationFaildResult,

package/dist/templates/next-app/src/uikit/components/AdminLayout.tsx

@@ -3,18 +3,20 @@
 import {
   DashboardOutlined,
   UserOutlined,
-  MenuFoldOutlined,
-  MenuUnfoldOutlined
+  VerticalAlignBottomOutlined,
+  VerticalAlignTopOutlined
 } from '@ant-design/icons';
 import { Layout, Menu } from 'antd';
 import { clsx } from 'clsx';
-import React, { useCallback, useMemo, type HTMLAttributes } from 'react';
+import React, { useMemo, type HTMLAttributes } from 'react';
 import { AdminPageManager } from '@/base/cases/AdminPageManager';
 import { BaseHeader } from './BaseHeader';
+import { LanguageSwitcher } from './LanguageSwitcher';
 import { LocaleLink } from './LocaleLink';
+import { LogoutButton } from './LogoutButton';
+import { ThemeSwitcher } from './ThemeSwitcher';
 import { useIOC } from '../hook/useIOC';
 import { useStore } from '../hook/useStore';
-import type { RenderLeftFunction } from './BaseHeader';
 import type { ItemType } from 'antd/es/menu/interface';
 
 const { Sider } = Layout;
@@ -33,7 +35,6 @@ export function AdminLayout(props: AdminLayoutProps) {
   const { children, className, mainClassName, ...rest } = props;
 
   const page = useIOC(AdminPageManager);
-
   const collapsedSidebar = useStore(page, page.selectors.collapsedSidebar);
   const navItems = useStore(page, page.selectors.navItems);
 
@@ -60,40 +61,46 @@ export function AdminLayout(props: AdminLayoutProps) {
     });
   }, [navItems]);
 
-  const renderHeaderLeft: RenderLeftFunction = useCallback(
-    ({ defaultElement }) => (
-      <div data-testid="AdminLayoutHeader" className="flex items-center">
-        <span
-          className="text-text hover:text-text-hover cursor-pointer text-md transition-colors"
-          onClick={() => page.toggleSidebar()}
-        >
-          {collapsedSidebar ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
-        </span>
-
-        {defaultElement}
-      </div>
-    ),
-    [collapsedSidebar, page]
-  );
+  const rightActions = useMemo(() => {
+    return [
+      <LanguageSwitcher key="language-switcher" />,
+      <ThemeSwitcher key="theme-switcher" />,
+      <LogoutButton key="logout-button" />
+    ];
+  }, []);
 
   return (
     <Layout data-testid="AdminLayout" className={className} {...rest}>
-      <div className="overflow-auto h-screen sticky top-0 bottom-0 scrollbar-thin scrollbar-gutter-stable">
+      <div className="overflow-y-auto overflow-x-hidden h-screen sticky top-0 bottom-0 scrollbar-thin scrollbar-gutter-stable">
         <Sider
-          className="h-full"
+          className="h-full relative"
           onCollapse={() => page.toggleSidebar()}
           collapsed={collapsedSidebar}
+          collapsedWidth={46}
         >
-          <div className="demo-logo-vertical" />
           <Menu mode="inline" items={sidebarItems} />
+
+          <div
+            data-testid="ToggleSidebarButton"
+            className="absolute w-2 right-0 top-0 bottom-0 bg-secondary cursor-pointer hover:bg-elevated flex items-center justify-center"
+            onClick={() => page.toggleSidebar()}
+          >
+            <span className="text-text scale-75 rotate-x-90">
+              {collapsedSidebar ? (
+                <VerticalAlignTopOutlined />
+              ) : (
+                <VerticalAlignBottomOutlined />
+              )}
+            </span>
+          </div>
         </Sider>
       </div>
 
       <Layout>
         <BaseHeader
           href="/admin"
-          showLogoutButton
-          renderLeft={renderHeaderLeft}
+          className="max-w-full pl-0"
+          rightActions={rightActions}
         />
         <main
           className={clsx('p-2 bg-primary text-text flex-1', mainClassName)}