refactor: move secrets mapping to settingspage

src/components/Eliza/components/Characterfile.tsx

@@ -10,9 +10,6 @@ import type { GoToProps, Step, Template } from '../utils/types';
 import type React from 'react';
 import {
   INITIAL_FORM,
-  SECRETS_CLIENT_MAP,
-  SECRETS_MODEL_PROVIDER_MAP,
-  SECRETS_PLUGIN_MAP,
   TEMPLATE_CHARACTERFILES_MAP,
   TEMPLATES,
   TEMPLATES_MAP,
@@ -27,7 +24,6 @@ import { StyleForm } from './StyleForm';
 import { FaChevronLeft } from 'react-icons/fa6';
 import { useState } from 'react';
 import { Input } from './Input';
-import type { CharacterFormSchema } from '../utils/schema';
 import { pages } from '../settings';
 import { PluginsDropdown } from './PluginsDropdown';
 
@@ -136,42 +132,20 @@ export const Characterfile: React.FC<CharacterfileProps> = ({
     handleSubmit,
     formState: { errors },
     reset,
-    setValue,
   } = useElizaForm();
 
   const hasErrors = Object.entries(errors).length > 0;
 
-  const mapSettingsSecretsAndUpdateForm = (data: CharacterFormSchema) => {
-    const { modelProvider, clients, plugins } = data;
-    const model = { ...SECRETS_MODEL_PROVIDER_MAP[modelProvider] };
-    const client = clients.reduce((acc, client) => {
-      const clientData = SECRETS_CLIENT_MAP[client];
-      return { ...acc, ...clientData };
-    }, {});
-    const plugin = plugins.reduce((acc, plugin) => {
-      const pluginData = SECRETS_PLUGIN_MAP[plugin];
-      return { ...acc, ...pluginData };
-    }, {});
-    const updatedSecrets = {
-      ...model,
-      ...client,
-      ...plugin,
-      ...data.settings.secrets,
-    };
-    setValue('settings.secrets', updatedSecrets);
-  };
-
   const onPrevious = () => {
     completeStep(0);
     reset(INITIAL_FORM);
     goTo('getStarted');
   };
 
-  const onSubmit = (data: CharacterFormSchema) => {
+  const onSubmit = () => {
     if (completedStep === 0) {
       completeStep(1);
     }
-    mapSettingsSecretsAndUpdateForm(data);
     goTo('settings');
   };
 

src/components/Eliza/components/SettingsPage.tsx

@@ -10,6 +10,7 @@ import { useForm } from 'react-hook-form';
 import { Input } from './Input';
 import { settingsSchema, type SettingsSchema } from '../utils/schema';
 import { zodResolver } from '@hookform/resolvers/zod';
+import { extractSecretsFromData } from '../utils/transformData';
 
 type HeaderProps = {
   onPrevious: () => void;
@@ -41,20 +42,20 @@ export const SettingsPage: React.FC<SettingsPageProps> = ({
 }) => {
   const { getValues, reset, setValue } = useElizaForm();
 
+  const data = getValues();
+
   const defaultValues = {
-    secrets: { ...getValues().settings.secrets },
-    voice: {
-      model: getValues().settings.voice.model,
-    },
+    secrets: extractSecretsFromData(data),
+    voice: { model: data.settings.voice.model },
   };
 
-  const formValues = Object.entries(defaultValues.secrets);
-
   const { register, handleSubmit, formState } = useForm<SettingsSchema>({
     defaultValues,
     resolver: zodResolver(settingsSchema),
   });
 
+  const formValues = Object.entries(defaultValues.secrets);
+
   const onPrevious = () => {
     reset();
     goTo('characterfile');

src/components/Eliza/utils/transformData.ts

@@ -2,6 +2,11 @@ import type { FieldError, FieldErrorsImpl, Merge } from 'react-hook-form';
 import type { Character } from './types';
 import type { CharacterfileSchema, CharacterFormSchema } from './schema';
 import type { Primitive, ZodError } from 'zod';
+import {
+  SECRETS_CLIENT_MAP,
+  SECRETS_MODEL_PROVIDER_MAP,
+  SECRETS_PLUGIN_MAP,
+} from './constants';
 
 type TransformedError = {
   label: string;
@@ -100,3 +105,22 @@ export const transformSchemaToCharacter = (
     },
   };
 };
+
+export const extractSecretsFromData = (data: CharacterFormSchema) => {
+  const { modelProvider, clients, plugins } = data;
+  const model = { ...SECRETS_MODEL_PROVIDER_MAP[modelProvider] };
+  const client = clients.reduce(
+    (acc, client) => ({ ...acc, ...SECRETS_CLIENT_MAP[client] }),
+    {},
+  );
+  const plugin = plugins.reduce(
+    (acc, plugin) => ({ ...acc, ...SECRETS_PLUGIN_MAP[plugin] }),
+    {},
+  );
+  return {
+    ...model,
+    ...client,
+    ...plugin,
+    ...data.settings.secrets,
+  };
+};