Refactor AccessScopeDropdown integration in AiAssistantManagementEditShare for improved layout and accessibility

apps/app/src/features/openai/client/components/AiAssistant/AiAssistantManagementModal/AccessScopeDropdown.tsx

@@ -2,7 +2,7 @@ import React, { useCallback } from 'react';
 
 import { useTranslation } from 'react-i18next';
 import {
-  UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem,
+  UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, Label,
 } from 'reactstrap';
 
 import { useCurrentUser } from '~/stores-universal/context';
@@ -35,7 +35,8 @@ export const AccessScopeDropdown: React.FC<Props> = (props: Props) => {
   }, [onSelect]);
 
   return (
-    <>
+    <div className="mb-4">
+      <Label className="text-secondary mb-2">ページのアクセス権限</Label>
       <UncontrolledDropdown>
         <DropdownToggle
           disabled={isDisabled}
@@ -52,6 +53,6 @@ export const AccessScopeDropdown: React.FC<Props> = (props: Props) => {
           ))}
         </DropdownMenu>
       </UncontrolledDropdown>
-    </>
+    </div>
   );
 };

apps/app/src/features/openai/client/components/AiAssistant/AiAssistantManagementModal/AiAssistantManagementEditShare.tsx

@@ -75,14 +75,11 @@ export const AiAssistantManagementEditShare = (props: Props): JSX.Element => {
           </Label>
         </div>
 
-        <div className="mb-4">
-          <Label className="text-secondary mb-2">ページのアクセス権限</Label>
-          <AccessScopeDropdown
-            isDisabled={!isShared}
-            selectedAccessScope={selectedAccessScope}
-            onSelect={selectAccessScopeHandler}
-          />
-        </div>
+        <AccessScopeDropdown
+          isDisabled={!isShared}
+          selectedAccessScope={selectedAccessScope}
+          onSelect={selectAccessScopeHandler}
+        />
 
         <ShareScopeSwitch
           isDisabled={!isShared}