fix: copilot not working (#3425)

apps/core/src/components/affine/setting-modal/general-setting/plugins/index.tsx

@@ -1,10 +1,38 @@
-import {
-  SettingHeader,
-  SettingWrapper,
-} from '@affine/component/setting-components';
+import { SettingHeader } from '@affine/component/setting-components';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { registeredPluginAtom } from '@toeverything/plugin-infra/atom';
+import {
+  registeredPluginAtom,
+  settingItemsAtom,
+} from '@toeverything/plugin-infra/atom';
 import { useAtomValue } from 'jotai';
+import type { FC, ReactNode } from 'react';
+import { useRef } from 'react';
+
+const PluginSettingWrapper: FC<{
+  id: string;
+  title?: ReactNode;
+}> = ({ title, id }) => {
+  const Setting = useAtomValue(settingItemsAtom)[id];
+  const disposeRef = useRef<(() => void) | null>(null);
+  return (
+    <div>
+      {title ? <div className="title">{title}</div> : null}
+      <div
+        ref={ref => {
+          if (ref && Setting) {
+            setTimeout(() => {
+              disposeRef.current = Setting(ref);
+            });
+          } else if (ref === null) {
+            setTimeout(() => {
+              disposeRef.current?.();
+            });
+          }
+        }}
+      />
+    </div>
+  );
+};
 
 export const Plugins = () => {
   const t = useAFFiNEI18N();
@@ -17,7 +45,7 @@ export const Plugins = () => {
         data-testid="plugins-title"
       />
       {allowedPlugins.map(plugin => (
-        <SettingWrapper key={plugin} title={plugin}></SettingWrapper>
+        <PluginSettingWrapper key={plugin} id={plugin} title={plugin} />
       ))}
     </>
   );