push (#414)

2023-04-04 09:41:24 -06:00
parent e8150e7195
commit e1f286efb8
19 changed files with 1685 additions and 267 deletions
@@ -0,0 +1,58 @@
+import { Plugin, PluginList } from '@/types/plugin';
+import { useTranslation } from 'next-i18next';
+import { FC, useEffect, useRef } from 'react';
+
+interface Props {
+  plugin: Plugin | null;
+  onPluginChange: (plugin: Plugin) => void;
+}
+
+export const PluginSelect: FC<Props> = ({ plugin, onPluginChange }) => {
+  const { t } = useTranslation('chat');
+
+  const selectRef = useRef<HTMLSelectElement>(null);
+
+  useEffect(() => {
+    if (selectRef.current) {
+      selectRef.current.focus();
+    }
+  }, []);
+
+  return (
+    <div className="flex flex-col">
+      <div className="w-full rounded-lg border border-neutral-200 bg-transparent pr-2 text-neutral-900 dark:border-neutral-600 dark:text-white">
+        <select
+          ref={selectRef}
+          className="w-full cursor-pointer bg-transparent p-2"
+          placeholder={t('Select a plugin') || ''}
+          value={plugin?.id || ''}
+          onChange={(e) => {
+            onPluginChange(
+              PluginList.find(
+                (plugin) => plugin.id === e.target.value,
+              ) as Plugin,
+            );
+          }}
+        >
+          <option
+            key="none"
+            value=""
+            className="dark:bg-[#343541] dark:text-white"
+          >
+            Select Plugin
+          </option>
+
+          {PluginList.map((plugin) => (
+            <option
+              key={plugin.id}
+              value={plugin.id}
+              className="dark:bg-[#343541] dark:text-white"
+            >
+              {plugin.name}
+            </option>
+          ))}
+        </select>
+      </div>
+    </div>
+  );
+};