@bbki.ng/site 5.8.2 → 5.8.4

package/src/plugins/blog/services/BlogUIService.ts

@@ -1,26 +1,14 @@
-import type React from 'react';
-
-import { IMiddlewareEntry, ISlotEntry } from '#/core/plugin-system/registry';
-import { createEventBus } from '#/core/utils/eventBus';
-import { IComPropsRegisteredToSlot } from '#/types/slots';
+import { createUIService } from '#/core/shared-service/factory/createUIService';
 
 import { BlogDataHookPoint, BlogSlotName, IBlogUIService } from './IBlogUIService';
 
-type RegistryEvents = {
-  'blog:slots:changed': void;
-  'blog:middleware:changed': BlogDataHookPoint;
-};
+const baseService = createUIService<BlogSlotName, BlogDataHookPoint>('blog');
 
 export class BlogUIService implements IBlogUIService {
   private static instance: BlogUIService;
 
   private constructor() {}
 
-  private slots = new Map<BlogSlotName, Array<ISlotEntry>>();
-  private middlewares = new Map<BlogDataHookPoint, IMiddlewareEntry<unknown>[]>();
-
-  private bus = createEventBus<RegistryEvents>();
-
   static getInstance(): BlogUIService {
     if (!BlogUIService.instance) {
       BlogUIService.instance = new BlogUIService();
@@ -28,93 +16,12 @@ export class BlogUIService implements IBlogUIService {
     return BlogUIService.instance;
   }
 
-  subscribeSlotChange(listener: () => void) {
-    return this.bus.on('blog:slots:changed', listener);
-  }
-
-  subscribeMiddlewareChange(listener: (hookPoint: BlogDataHookPoint) => void) {
-    return this.bus.on('blog:middleware:changed', listener);
-  }
-
-  registerMiddleware: <S>(
-    hookPoint: BlogDataHookPoint,
-    fn: (data: S) => S | Promise<S>,
-    pluginId: string,
-    weight?: number
-  ) => void = <S>(
-    hookPoint: BlogDataHookPoint,
-    fn: (data: S) => S | Promise<S>,
-    pluginId: string,
-    weight = 0
-  ) => {
-    const existing = this.middlewares.get(hookPoint) || [];
-
-    const newEntry: IMiddlewareEntry<S> = {
-      id: `${pluginId}-${hookPoint}-middleware`,
-      pluginId,
-      fn,
-      weight,
-    };
-
-    const updated = [...existing, newEntry as IMiddlewareEntry<unknown>].sort(
-      (a, b) => (b.weight || 0) - (a.weight || 0)
-    );
-    this.middlewares.set(hookPoint, updated);
-
-    this.bus.emit('blog:middleware:changed', hookPoint);
-  };
-
-  registerSlot: (
-    slotName: BlogSlotName,
-    component: React.ComponentType<{ data: unknown }>,
-    pluginId: string,
-    weight?: number
-  ) => void = (slotName, component, pluginId, weight = 0) => {
-    const existing = this.slots.get(slotName) || [];
-    const newEntry: ISlotEntry = {
-      id: `${pluginId}-${slotName}-slot`,
-      pluginId,
-      component,
-      weight,
-    };
-
-    const updated = [...existing, newEntry].sort((a, b) => (b.weight || 0) - (a.weight || 0));
-    this.slots.set(slotName, updated);
-
-    this.bus.emit('blog:slots:changed', undefined);
-  };
-
-  unregisterAllByPluginId: (pluginId: string) => void = pluginId => {
-    // 移除中间件
-    this.middlewares.forEach((entries, hookPoint) => {
-      const filtered = entries.filter(entry => entry.pluginId !== pluginId);
-      if (filtered.length !== entries.length) {
-        this.middlewares.set(hookPoint, filtered);
-        this.bus.emit('blog:middleware:changed', hookPoint);
-      }
-    });
-
-    // 移除插槽组件
-    this.slots.forEach((entries, slotName) => {
-      const filtered = entries.filter(entry => entry.pluginId !== pluginId);
-      if (filtered.length !== entries.length) {
-        this.slots.set(slotName, filtered);
-      }
-    });
-
-    this.bus.emit('blog:slots:changed', undefined);
-  };
-
-  getComponents(slotName: BlogSlotName): React.ComponentType<IComPropsRegisteredToSlot>[] {
-    return (this.slots.get(slotName) || []).map(entry => entry.component);
-  }
-
-  async runMiddlewares<T>(point: BlogDataHookPoint, data: T): Promise<T> {
-    const fns = (this.middlewares.get(point) || []).map(entry => entry.fn);
-    let result = data;
-    for (const fn of fns) {
-      result = (await fn(result)) as T;
-    }
-    return result;
-  }
+  registerSlot = baseService.registerSlot.bind(baseService);
+  registerMiddleware = baseService.registerMiddleware.bind(baseService);
+  unregisterAllByPluginId = baseService.unregisterAllByPluginId.bind(baseService);
+  getSlotEntries = baseService.getSlotEntries.bind(baseService);
+  getComponents = baseService.getComponents.bind(baseService);
+  subscribeSlotChange = baseService.subscribeSlotChange.bind(baseService);
+  subscribeMiddlewareChange = baseService.subscribeMiddlewareChange.bind(baseService);
+  runMiddlewares = baseService.runMiddlewares.bind(baseService);
 }

package/src/plugins/blog/services/IBlogUIService.ts

@@ -1,5 +1,3 @@
-import type React from 'react';
-
 import { type IBaseUIService } from '#/core/shared-service/contract/IUIService';
 
 declare module '#/core/shared-service/service-registry' {
@@ -15,17 +13,4 @@ export type BlogDataHookPoint =
   | 'blog:transformPostContent'
   | 'blog:transformTitleList';
 
-export interface IBlogUIService extends IBaseUIService<BlogSlotName, BlogDataHookPoint> {
-  registerMiddleware: <S>(
-    hookPoint: BlogDataHookPoint,
-    fn: (data: S) => S | Promise<S>,
-    pluginId: string,
-    weight?: number
-  ) => void;
-  registerSlot: (
-    slotName: BlogSlotName,
-    component: React.ComponentType<{ data: unknown }>,
-    pluginId: string,
-    weight?: number
-  ) => void;
-}
+export interface IBlogUIService extends IBaseUIService<BlogSlotName, BlogDataHookPoint> {}

package/src/plugins/store/components/storeIcon.tsx

@@ -0,0 +1,16 @@
+import { Link } from '@bbki.ng/ui';
+
+const CupIcon = () => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16">
+    <path d="M8.75 8h6.5a.75.75 0 0 1 .75.75v6.5a.75.75 0 0 1-.75.75h-6.5a.75.75 0 0 1-.75-.75v-6.5A.75.75 0 0 1 8.75 8Zm.75 6.5h5v-5h-5Z"></path>
+    <path d="M15.25 1a.75.75 0 0 1 .75.75V4h2.25c.966 0 1.75.784 1.75 1.75V8h2.25a.75.75 0 0 1 0 1.5H20v5h2.25a.75.75 0 0 1 0 1.5H20v2.25A1.75 1.75 0 0 1 18.25 20H16v2.25a.75.75 0 0 1-1.5 0V20h-5v2.25a.75.75 0 0 1-1.5 0V20H5.75A1.75 1.75 0 0 1 4 18.25V16H1.75a.75.75 0 0 1 0-1.5H4v-5H1.75a.75.75 0 0 1 0-1.5H4V5.75C4 4.784 4.784 4 5.75 4H8V1.75a.75.75 0 0 1 1.5 0V4h5V1.75a.75.75 0 0 1 .75-.75Zm3 17.5a.25.25 0 0 0 .25-.25V5.75a.25.25 0 0 0-.25-.25H5.75a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25Z"></path>
+  </svg>
+);
+
+export const StoreIcon = () => {
+  return (
+    <Link to="/store" className="flex items-center">
+      <CupIcon />
+    </Link>
+  );
+};

package/src/plugins/store/index.ts

@@ -2,6 +2,7 @@ import { BBPlugin } from '#/core/plugin-system/bbplugin';
 import { IHostContext } from '#/types/hostApi';
 import { PluginID } from '#/types/plugin';
 
+import { StoreIcon } from './components/storeIcon';
 import { StorePage } from './components/storePage';
 import { StoreCtx } from './context';
 
@@ -20,10 +21,11 @@ export class StorePlugin extends BBPlugin {
       return;
     }
 
+    systemUIService.registerSlot('nav-right', StoreIcon, this.id);
+
     systemUIService.registerPluginEntry(
       {
         path: '/store',
-        label: 'cd ./store',
         pageComponent: StoreCtx.withCtx(
           {
             install: ctx.store?.installPlugin || (async () => false),

package/src/types/slots.ts

@@ -1,20 +1,3 @@
-export type SlotName =
-  | 'leftCol'
-  | 'rightCol'
-  | 'articleActionRow'
-  | 'logo'
-  | 'route'
-  | 'pageFooter'
-  | 'articleTitle';
-
-export type HookPoint =
-  | 'filterPosts'
-  | 'transformPostContent'
-  | 'transformBreadcrumbPath'
-  | 'transformTitleList'
-  | 'extendedRoutes'
-  | 'transformCoverEntry';
-
 export interface IComPropsRegisteredToSlot {
   data: unknown;
 }

package/tsconfig.json

@@ -2,7 +2,7 @@
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "jsx": "react",
+    "jsx": "react-jsx",
     "noEmit": true,
     "moduleResolution": "bundler",
     "paths": {

package/src/utils/index.tsx

@@ -1,20 +0,0 @@
-import { PathRouteProps } from 'react-router-dom';
-import React from 'react';
-
-import { IPluginEntry } from '#/types/plugin';
-import { IComPropsRegisteredToSlot } from '#/types/slots';
-
-export const buildEntrySlotCom = (entry: IPluginEntry) => {
-  const Component = (props: IComPropsRegisteredToSlot) => {
-    const route = props.data as Omit<PathRouteProps, 'element'>;
-    if (route.path === entry.path) {
-      const Com = entry.pageComponent;
-      return <Com data={props.data} />;
-    }
-    return null;
-  };
-
-  Component.displayName = `EntrySlotCom(${entry.path})`;
-
-  return Component;
-};