xertica-ui 2.5.1 → 2.5.2

package/components/assistant/xertica-assistant/parts/AssistantFeedbackDialog.tsx

@@ -1,88 +1,88 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { Button } from '../../../ui/button';
-import { Textarea } from '../../../ui/textarea';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from '../../../ui/dialog';
-
-export interface EvaluationState {
-  isOpen: boolean;
-  messageId: string | null;
-  type?: 'dislike' | null;
-  category?: string | null;
-  reason: string;
-}
-
-interface AssistantFeedbackDialogProps {
-  state: EvaluationState;
-  onReasonChange: (reason: string) => void;
-  onClose: () => void;
-  onSubmit: () => void;
-}
-
-/**
- * AssistantFeedbackDialog — Modal dialog for collecting negative feedback (dislike) on messages.
- * Supports both categorized feedback (from feedbackOptions) and free-text input.
- */
-export function AssistantFeedbackDialog({
-  state,
-  onReasonChange,
-  onClose,
-  onSubmit,
-}: AssistantFeedbackDialogProps) {
-  const { t } = useTranslation();
-  return (
-    <Dialog open={state.isOpen} onOpenChange={open => !open && onClose()}>
-      <DialogContent className="sm:max-w-[600px]">
-        <DialogHeader>
-          <DialogTitle className="pr-8">
-            {state.category
-              ? t('assistant.feedbackDialog.titleWithCategory', { category: state.category })
-              : t('assistant.feedbackDialog.title')}
-          </DialogTitle>
-          <DialogDescription>
-            {state.category
-              ? t('assistant.feedbackDialog.descriptionOptional')
-              : t('assistant.feedbackDialog.description')}
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="grid gap-4 py-4 px-6">
-          <Textarea
-            className="min-h-[100px]"
-            placeholder={
-              state.category
-                ? t('assistant.feedbackDialog.placeholderOptional')
-                : t('assistant.feedbackDialog.placeholder')
-            }
-            aria-label={
-              state.category
-                ? t('assistant.feedbackDialog.placeholderOptional')
-                : t('assistant.feedbackDialog.placeholder')
-            }
-            value={state.reason}
-            onChange={e => onReasonChange(e.target.value)}
-            rows={4}
-          />
-        </div>
-
-        <DialogFooter>
-          <Button variant="outline" onClick={onClose}>
-            {t('common.cancel')}
-          </Button>
-          <Button onClick={onSubmit} disabled={!state.category && !state.reason.trim()}>
-            {state.category
-              ? t('assistant.feedbackDialog.confirmAndSend')
-              : t('assistant.feedbackDialog.send')}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { Button } from '../../../ui/button';
+import { Textarea } from '../../../ui/textarea';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '../../../ui/dialog';
+
+export interface EvaluationState {
+  isOpen: boolean;
+  messageId: string | null;
+  type?: 'dislike' | null;
+  category?: string | null;
+  reason: string;
+}
+
+interface AssistantFeedbackDialogProps {
+  state: EvaluationState;
+  onReasonChange: (reason: string) => void;
+  onClose: () => void;
+  onSubmit: () => void;
+}
+
+/**
+ * AssistantFeedbackDialog — Modal dialog for collecting negative feedback (dislike) on messages.
+ * Supports both categorized feedback (from feedbackOptions) and free-text input.
+ */
+export function AssistantFeedbackDialog({
+  state,
+  onReasonChange,
+  onClose,
+  onSubmit,
+}: AssistantFeedbackDialogProps) {
+  const { t } = useTranslation();
+  return (
+    <Dialog open={state.isOpen} onOpenChange={open => !open && onClose()}>
+      <DialogContent className="sm:max-w-[600px]">
+        <DialogHeader>
+          <DialogTitle className="pr-8">
+            {state.category
+              ? t('assistant.feedbackDialog.titleWithCategory', { category: state.category })
+              : t('assistant.feedbackDialog.title')}
+          </DialogTitle>
+          <DialogDescription>
+            {state.category
+              ? t('assistant.feedbackDialog.descriptionOptional')
+              : t('assistant.feedbackDialog.description')}
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="grid gap-4 py-4 px-6">
+          <Textarea
+            className="min-h-[100px]"
+            placeholder={
+              state.category
+                ? t('assistant.feedbackDialog.placeholderOptional')
+                : t('assistant.feedbackDialog.placeholder')
+            }
+            aria-label={
+              state.category
+                ? t('assistant.feedbackDialog.placeholderOptional')
+                : t('assistant.feedbackDialog.placeholder')
+            }
+            value={state.reason}
+            onChange={e => onReasonChange(e.target.value)}
+            rows={4}
+          />
+        </div>
+
+        <DialogFooter>
+          <Button variant="outline" onClick={onClose}>
+            {t('common.cancel')}
+          </Button>
+          <Button onClick={onSubmit} disabled={!state.category && !state.reason.trim()}>
+            {state.category
+              ? t('assistant.feedbackDialog.confirmAndSend')
+              : t('assistant.feedbackDialog.send')}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

package/components/assistant/xertica-assistant/parts/AssistantHeader.tsx

@@ -1,75 +1,75 @@
-import React from 'react';
-import { ChevronRight, PanelRight, Maximize2 } from 'lucide-react';
-import { motion } from 'framer-motion';
-import { useTranslation } from 'react-i18next';
-import { Button } from '../../../ui/button';
-import { XerticaOrbe } from '../../../brand/xertica-orbe';
-import { cn } from '../../../shared/utils';
-
-interface AssistantHeaderProps {
-  isExpanded: boolean;
-  onToggle: () => void;
-  onNavigateFullPage?: () => void;
-}
-
-/**
- * AssistantHeader — Top bar shown in expanded/collapsed (non-fullPage) mode.
- * Contains the Xertica Orbe logo, title, expand-to-full-page button, and toggle button.
- */
-export function AssistantHeader({
-  isExpanded,
-  onToggle,
-  onNavigateFullPage,
-}: AssistantHeaderProps) {
-  const { t } = useTranslation();
-  return (
-    <div
-      className={cn(
-        'border-b border-border flex items-center h-[64px]',
-        isExpanded ? 'justify-between px-4' : 'justify-center px-0'
-      )}
-    >
-      {isExpanded && (
-        <motion.div
-          initial={{ opacity: 0, x: -10 }}
-          animate={{ opacity: 1, x: 0 }}
-          exit={{ opacity: 0, x: -10 }}
-          className="flex items-center gap-2 overflow-hidden"
-        >
-          <div className="flex-shrink-0">
-            <XerticaOrbe size={32} />
-          </div>
-          <span className="text-foreground font-medium truncate">{t('assistant.title')}</span>
-        </motion.div>
-      )}
-
-      <div className="flex items-center gap-1">
-        {isExpanded && onNavigateFullPage && (
-          <Button
-            variant="ghost"
-            size="sm"
-            onClick={onNavigateFullPage}
-            className="h-8 w-8 p-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-full"
-            title={t('assistant.expand')}
-            aria-label={t('assistant.expand')}
-          >
-            <Maximize2 className="w-4 h-4" />
-          </Button>
-        )}
-
-        <Button
-          variant="ghost"
-          size="sm"
-          onClick={onToggle}
-          className={cn(
-            'h-8 w-8 p-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-full',
-            !isExpanded && 'w-10 h-10'
-          )}
-          aria-label={isExpanded ? t('assistant.collapse') : t('assistant.expand')}
-        >
-          {isExpanded ? <ChevronRight className="w-4 h-4" /> : <PanelRight className="w-4 h-4" />}
-        </Button>
-      </div>
-    </div>
-  );
-}
+import React from 'react';
+import { ChevronRight, PanelRight, Maximize2 } from 'lucide-react';
+import { motion } from 'framer-motion';
+import { useTranslation } from 'react-i18next';
+import { Button } from '../../../ui/button';
+import { XerticaOrbe } from '../../../brand/xertica-orbe';
+import { cn } from '../../../shared/utils';
+
+interface AssistantHeaderProps {
+  isExpanded: boolean;
+  onToggle: () => void;
+  onNavigateFullPage?: () => void;
+}
+
+/**
+ * AssistantHeader — Top bar shown in expanded/collapsed (non-fullPage) mode.
+ * Contains the Xertica Orbe logo, title, expand-to-full-page button, and toggle button.
+ */
+export function AssistantHeader({
+  isExpanded,
+  onToggle,
+  onNavigateFullPage,
+}: AssistantHeaderProps) {
+  const { t } = useTranslation();
+  return (
+    <div
+      className={cn(
+        'border-b border-border flex items-center h-[64px]',
+        isExpanded ? 'justify-between px-4' : 'justify-center px-0'
+      )}
+    >
+      {isExpanded && (
+        <motion.div
+          initial={{ opacity: 0, x: -10 }}
+          animate={{ opacity: 1, x: 0 }}
+          exit={{ opacity: 0, x: -10 }}
+          className="flex items-center gap-2 overflow-hidden"
+        >
+          <div className="flex-shrink-0">
+            <XerticaOrbe size={32} />
+          </div>
+          <span className="text-foreground font-medium truncate">{t('assistant.title')}</span>
+        </motion.div>
+      )}
+
+      <div className="flex items-center gap-1">
+        {isExpanded && onNavigateFullPage && (
+          <Button
+            variant="ghost"
+            size="sm"
+            onClick={onNavigateFullPage}
+            className="h-8 w-8 p-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-full"
+            title={t('assistant.expand')}
+            aria-label={t('assistant.expand')}
+          >
+            <Maximize2 className="w-4 h-4" />
+          </Button>
+        )}
+
+        <Button
+          variant="ghost"
+          size="sm"
+          onClick={onToggle}
+          className={cn(
+            'h-8 w-8 p-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-full',
+            !isExpanded && 'w-10 h-10'
+          )}
+          aria-label={isExpanded ? t('assistant.collapse') : t('assistant.expand')}
+        >
+          {isExpanded ? <ChevronRight className="w-4 h-4" /> : <PanelRight className="w-4 h-4" />}
+        </Button>
+      </div>
+    </div>
+  );
+}