✋ feat: Stop Sequences for Conversations & Presets (#2536)

* feat: `stop` conversation parameter

* feat: Tag primitive

* feat: dynamic tags

* refactor: update tag styling

* feat: add stop sequences to OpenAI settings

* fix(Presentation): prevent `SidePanel` re-renders that flicker side panel

* refactor: use stop placeholder

* feat: type and schema update for `stop` and `TPreset` in generation param related types

* refactor: pass conversation to dynamic settings

* refactor(OpenAIClient): remove default handling for `modelOptions.stop`

* docs: fix Google AI Setup formatting

* feat: current_model

* docs: WIP update

* fix(ChatRoute): prevent default preset override before `hasSetConversation.current` becomes true by including latest conversation state as template

* docs: update docs with more info on `stop`

* chore: bump config_version

* refactor: CURRENT_MODEL handling

client/src/components/ui/Tag.tsx

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { X } from 'lucide-react';
+import { cn } from '~/utils';
+
+type TagProps = React.ComponentPropsWithoutRef<'div'> & {
+  label: string;
+  labelClassName?: string;
+  CancelButton?: React.ReactNode;
+  onRemove: (e: React.MouseEvent<HTMLButtonElement>) => void;
+};
+
+const TagPrimitiveRoot = React.forwardRef<HTMLDivElement, TagProps>(
+  ({ CancelButton, label, onRemove, className = '', labelClassName = '', ...props }, ref) => (
+    <div
+      ref={ref}
+      {...props}
+      className={cn(
+        'flex max-h-8 items-center overflow-y-hidden rounded rounded-3xl border-2 border-green-600 bg-green-600/20 text-sm text-xs text-white',
+        className,
+      )}
+    >
+      <div className={cn('ml-1 whitespace-pre-wrap px-2 py-1', labelClassName)}>{label}</div>
+      {CancelButton ? (
+        CancelButton
+      ) : (
+        <button
+          onClick={(e) => {
+            e.stopPropagation();
+            onRemove(e);
+          }}
+          className="rounded-full bg-green-600/50"
+          aria-label={`Remove ${label}`}
+        >
+          <X className="m-[1.5px] p-1" />
+        </button>
+      )}
+    </div>
+  ),
+);
+
+TagPrimitiveRoot.displayName = 'Tag';
+
+export const Tag = React.memo(TagPrimitiveRoot);

client/src/components/ui/index.ts

@@ -16,6 +16,7 @@ export * from './Separator';
 export * from './Switch';
 export * from './Table';
 export * from './Tabs';
+export * from './Tag';
 export * from './Templates';
 export * from './Textarea';
 export * from './TextareaAutosize';