refactor(types): use zod for better type safety, style(Messages): new scroll behavior, style(Buttons): match ChatGPT (#761)

* feat: add zod schemas for better type safety

* refactor(useSetOptions): remove 'as Type' in favor of zod schema

* fix: descendant console error, change <p> tag to <div> tag for content in PluginTooltip component

* style(MessagesView): instant/snappier scroll behavior matching official site

* fix(Messages): add null check for scrollableRef before accessing its properties in handleScroll and useEffect

* fix(messageSchema.js): change type of invocationId from string to number
fix(schemas.ts): make authenticated property in tPluginSchema optional
fix(schemas.ts): make isButton property in tPluginSchema optional
fix(schemas.ts): make messages property in tConversationSchema optional and change its type to array of strings
fix(schemas.ts): make systemMessage property in tConversationSchema nullable and optional
fix(schemas.ts): make modelLabel property in tConversationSchema nullable and optional
fix(schemas.ts): make chatGptLabel property in tConversationSchema nullable and optional
fix(schemas.ts): make promptPrefix property in tConversationSchema nullable and optional
fix(schemas.ts): make context property in tConversationSchema nullable and optional
fix(schemas.ts): make jailbreakConversationId property in tConversationSchema nullable and optional
fix(schemas.ts): make conversationSignature property in tConversationSchema nullable and optional
fix(schemas.ts): make clientId property

* refactor(types): replace main types with zod schemas and inferred types

* refactor(types/schemas): use schemas for better type safety of main types

* style(ModelSelect/Buttons): remove shadow and transition

* style(ModelSelect): button changes to closer match OpenAI

* style(ModelSelect): remove green rings which flicker

* style(scrollToBottom): add two separate scrolling functions

* fix(OptionsBar.tsx): handle onFocus and onBlur events to update opacityClass
fix(Messages/index.jsx): increase debounce time for scrollIntoView function

packages/data-provider/src/schemas.ts

@@ -0,0 +1,121 @@
+import { z } from 'zod';
+
+export enum EModelEndpoint {
+  azureOpenAI = 'azureOpenAI',
+  openAI = 'openAI',
+  bingAI = 'bingAI',
+  chatGPT = 'chatGPT',
+  chatGPTBrowser = 'chatGPTBrowser',
+  google = 'google',
+  gptPlugins = 'gptPlugins',
+  anthropic = 'anthropic',
+}
+
+export const eModelEndpointSchema = z.nativeEnum(EModelEndpoint);
+
+export const tMessageSchema = z.object({
+  messageId: z.string(),
+  conversationId: z.string(),
+  clientId: z.string(),
+  parentMessageId: z.string(),
+  sender: z.string(),
+  text: z.string(),
+  isCreatedByUser: z.boolean(),
+  error: z.boolean(),
+  createdAt: z.string(),
+  updatedAt: z.string(),
+});
+
+export type TMessage = z.infer<typeof tMessageSchema>;
+
+export const tPluginAuthConfigSchema = z.object({
+  authField: z.string(),
+  label: z.string(),
+  description: z.string(),
+});
+
+export type TPluginAuthConfig = z.infer<typeof tPluginAuthConfigSchema>;
+
+export const tPluginSchema = z.object({
+  name: z.string(),
+  pluginKey: z.string(),
+  description: z.string(),
+  icon: z.string(),
+  authConfig: z.array(tPluginAuthConfigSchema),
+  authenticated: z.boolean().optional(),
+  isButton: z.boolean().optional(),
+});
+
+export type TPlugin = z.infer<typeof tPluginSchema>;
+
+export const tExampleSchema = z.object({
+  input: z.object({
+    content: z.string(),
+  }),
+  output: z.object({
+    content: z.string(),
+  }),
+});
+
+export type TExample = z.infer<typeof tExampleSchema>;
+
+export const tAgentOptionsSchema = z.object({
+  agent: z.string(),
+  skipCompletion: z.boolean(),
+  model: z.string(),
+  temperature: z.number(),
+});
+
+export const tConversationSchema = z.object({
+  conversationId: z.string().nullable(),
+  title: z.string(),
+  user: z.string().optional(),
+  endpoint: eModelEndpointSchema.nullable(),
+  suggestions: z.array(z.string()).optional(),
+  messages: z.array(z.string()).optional(),
+  tools: z.array(tPluginSchema).optional(),
+  createdAt: z.string(),
+  updatedAt: z.string(),
+  systemMessage: z.string().nullable().optional(),
+  modelLabel: z.string().nullable().optional(),
+  examples: z.array(tExampleSchema).optional(),
+  chatGptLabel: z.string().nullable().optional(),
+  userLabel: z.string().optional(),
+  model: z.string().optional(),
+  promptPrefix: z.string().nullable().optional(),
+  temperature: z.number().optional(),
+  topP: z.number().optional(),
+  topK: z.number().optional(),
+  context: z.string().nullable().optional(),
+  top_p: z.number().optional(),
+  frequency_penalty: z.number().optional(),
+  presence_penalty: z.number().optional(),
+  jailbreak: z.boolean().optional(),
+  jailbreakConversationId: z.string().nullable().optional(),
+  conversationSignature: z.string().nullable().optional(),
+  parentMessageId: z.string().optional(),
+  clientId: z.string().nullable().optional(),
+  invocationId: z.number().nullable().optional(),
+  toneStyle: z.string().nullable().optional(),
+  maxOutputTokens: z.number().optional(),
+  agentOptions: tAgentOptionsSchema.nullable().optional(),
+});
+
+export type TConversation = z.infer<typeof tConversationSchema>;
+
+export const tPresetSchema = tConversationSchema
+  .omit({
+    conversationId: true,
+    createdAt: true,
+    updatedAt: true,
+    title: true,
+  })
+  .merge(
+    z.object({
+      conversationId: z.string().optional(),
+      presetId: z.string().nullable().optional(),
+      title: z.string().nullable().optional(),
+    }),
+  );
+
+export type TPreset = z.infer<typeof tPresetSchema>;