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/data-service.ts

@@ -1,4 +1,5 @@
 import * as t from './types';
+import * as s from './schemas';
 import request from './request';
 import * as endpoints from './api-endpoints';
 
@@ -23,11 +24,11 @@ export function clearAllConversations(): Promise<unknown> {
   return request.post(endpoints.deleteConversation(), { arg: {} });
 }
 
-export function getMessagesByConvoId(id: string): Promise<t.TMessage[]> {
+export function getMessagesByConvoId(id: string): Promise<s.TMessage[]> {
   return request.get(endpoints.messages(id));
 }
 
-export function getConversationById(id: string): Promise<t.TConversation> {
+export function getConversationById(id: string): Promise<s.TConversation> {
   return request.get(endpoints.conversationById(id));
 }
 
@@ -37,19 +38,19 @@ export function updateConversation(
   return request.post(endpoints.updateConversation(), { arg: payload });
 }
 
-export function getPresets(): Promise<t.TPreset[]> {
+export function getPresets(): Promise<s.TPreset[]> {
   return request.get(endpoints.presets());
 }
 
-export function createPreset(payload: t.TPreset): Promise<t.TPreset[]> {
+export function createPreset(payload: s.TPreset): Promise<s.TPreset[]> {
   return request.post(endpoints.presets(), payload);
 }
 
-export function updatePreset(payload: t.TPreset): Promise<t.TPreset[]> {
+export function updatePreset(payload: s.TPreset): Promise<s.TPreset[]> {
   return request.post(endpoints.presets(), payload);
 }
 
-export function deletePreset(arg: t.TPreset | object): Promise<t.TPreset[]> {
+export function deletePreset(arg: s.TPreset | object): Promise<s.TPreset[]> {
   return request.post(endpoints.deletePreset(), arg);
 }
 
@@ -106,7 +107,7 @@ export const resetPassword = (payload: t.TResetPassword) => {
   return request.post(endpoints.resetPassword(), payload);
 };
 
-export const getAvailablePlugins = (): Promise<t.TPlugin[]> => {
+export const getAvailablePlugins = (): Promise<s.TPlugin[]> => {
   return request.get(endpoints.plugins());
 };