Modify to control visibility through props

apps/app/src/features/openai/client/components/AiAssistant/AiAssistantSidebar/AiAssistantSidebar.tsx

@@ -325,7 +325,13 @@ const AiAssistantSidebarSubstance: React.FC<AiAssistantSidebarSubstanceProps> =
             ? (
               <div className="vstack gap-4 pb-2">
                 { messageLogs.map(message => (
-                  <MessageCard key={message.id} role={message.isUserMessage ? 'user' : 'assistant'}>{message.content}</MessageCard>
+                  <MessageCard
+                    key={message.id}
+                    role={message.isUserMessage ? 'user' : 'assistant'}
+                    showActionButtons={isEditorAssistant}
+                  >
+                    {message.content}
+                  </MessageCard>
                 )) }
                 { generatingAnswerMessage != null && (
                   <MessageCard role="assistant">{generatingAnswerMessage.content}</MessageCard>

apps/app/src/features/openai/client/components/AiAssistant/AiAssistantSidebar/MessageCard.tsx

@@ -40,7 +40,7 @@ const NextLinkWrapper = (props: LinkProps & {children: string, href: string}): J
   );
 };
 
-const AssistantMessageCard = ({ children }: { children: string }): JSX.Element => {
+const AssistantMessageCard = ({ children, showActionButtons }: { children: string, showActionButtons?: boolean }): JSX.Element => {
   const { t } = useTranslation();
 
   return (
@@ -54,20 +54,23 @@ const AssistantMessageCard = ({ children }: { children: string }): JSX.Element =
             ? (
               <>
                 <ReactMarkdown components={{ a: NextLinkWrapper }}>{children}</ReactMarkdown>
-                <div className="d-flex mt-2 justify-content-start">
-                  <button
-                    type="button"
-                    className="btn btn-outline-secondary me-2"
-                  >
-                    破棄
-                  </button>
-                  <button
-                    type="button"
-                    className="btn btn-outline-secondary"
-                  >
-                    採用
-                  </button>
-                </div>
+
+                {showActionButtons && (
+                  <div className="d-flex mt-2 justify-content-start">
+                    <button
+                      type="button"
+                      className="btn btn-outline-secondary me-2"
+                    >
+                      破棄
+                    </button>
+                    <button
+                      type="button"
+                      className="btn btn-outline-secondary"
+                    >
+                      採用
+                    </button>
+                  </div>
+                )}
               </>
             )
             : (
@@ -85,12 +88,13 @@ const AssistantMessageCard = ({ children }: { children: string }): JSX.Element =
 type Props = {
   role: 'user' | 'assistant',
   children: string,
+  showActionButtons?: boolean,
 }
 
 export const MessageCard = (props: Props): JSX.Element => {
-  const { role, children } = props;
+  const { role, children, showActionButtons } = props;
 
   return role === 'user'
     ? <UserMessageCard>{children}</UserMessageCard>
-    : <AssistantMessageCard>{children}</AssistantMessageCard>;
+    : <AssistantMessageCard showActionButtons={showActionButtons}>{children}</AssistantMessageCard>;
 };