|
@@ -1,5 +1,6 @@
|
|
|
import React, { useCallback, useState } from 'react';
|
|
import React, { useCallback, useState } from 'react';
|
|
|
|
|
|
|
|
|
|
+import { useTranslation } from 'react-i18next';
|
|
|
import {
|
|
import {
|
|
|
Input, Label, FormGroup,
|
|
Input, Label, FormGroup,
|
|
|
} from 'reactstrap';
|
|
} from 'reactstrap';
|
|
@@ -31,6 +32,9 @@ export const ShareScopeSwitch: React.FC<Props> = (props: Props) => {
|
|
|
selectedAccessScope,
|
|
selectedAccessScope,
|
|
|
onSelect,
|
|
onSelect,
|
|
|
} = props;
|
|
} = props;
|
|
|
|
|
+
|
|
|
|
|
+ const { t } = useTranslation();
|
|
|
|
|
+
|
|
|
const [selectedScope, setSelectedScope] = useState<ShareScopeSwitchType>(ShareScopeSwitchType.SAME_AS_ACCESS_SCOPE);
|
|
const [selectedScope, setSelectedScope] = useState<ShareScopeSwitchType>(ShareScopeSwitchType.SAME_AS_ACCESS_SCOPE);
|
|
|
|
|
|
|
|
const checkShareScopeRadioHandler = useCallback((shareScope: ShareScopeSwitchType) => {
|
|
const checkShareScopeRadioHandler = useCallback((shareScope: ShareScopeSwitchType) => {
|
|
@@ -48,53 +52,24 @@ export const ShareScopeSwitch: React.FC<Props> = (props: Props) => {
|
|
|
<div className="mb-4">
|
|
<div className="mb-4">
|
|
|
<Label className="text-secondary mb-3">アシスタントの共有範囲</Label>
|
|
<Label className="text-secondary mb-3">アシスタントの共有範囲</Label>
|
|
|
<div className="d-flex flex-column gap-3">
|
|
<div className="d-flex flex-column gap-3">
|
|
|
- <FormGroup check>
|
|
|
|
|
- <Input
|
|
|
|
|
- type="radio"
|
|
|
|
|
- name="shareScope"
|
|
|
|
|
- id="shareAll"
|
|
|
|
|
- className="form-check-input"
|
|
|
|
|
- disabled={isDisabled}
|
|
|
|
|
- onChange={() => checkShareScopeRadioHandler(ShareScopeSwitchType.PUBLIC_ONLY)}
|
|
|
|
|
- checked={selectedScope === ShareScopeSwitchType.PUBLIC_ONLY}
|
|
|
|
|
- />
|
|
|
|
|
- <Label check for="shareAll" className="d-flex flex-column">
|
|
|
|
|
- <span>全体公開</span>
|
|
|
|
|
- <small className="text-secondary">全てのユーザーに共有されます</small>
|
|
|
|
|
- </Label>
|
|
|
|
|
- </FormGroup>
|
|
|
|
|
-
|
|
|
|
|
- <FormGroup check>
|
|
|
|
|
- <Input
|
|
|
|
|
- type="radio"
|
|
|
|
|
- name="shareScope"
|
|
|
|
|
- id="shareGroup"
|
|
|
|
|
- className="form-check-input"
|
|
|
|
|
- disabled={isDisabled}
|
|
|
|
|
- onChange={() => checkShareScopeRadioHandler(ShareScopeSwitchType.GROUPS)}
|
|
|
|
|
- checked={selectedScope === ShareScopeSwitchType.GROUPS}
|
|
|
|
|
- />
|
|
|
|
|
- <Label check for="shareGroup" className="d-flex flex-column">
|
|
|
|
|
- <span>グループを指定</span>
|
|
|
|
|
- <small className="text-secondary">選択したグループのメンバーにのみ共有されます</small>
|
|
|
|
|
- </Label>
|
|
|
|
|
- </FormGroup>
|
|
|
|
|
|
|
|
|
|
- <FormGroup check>
|
|
|
|
|
- <Input
|
|
|
|
|
- type="radio"
|
|
|
|
|
- name="shareScope"
|
|
|
|
|
- id="shareAccess"
|
|
|
|
|
- className="form-check-input"
|
|
|
|
|
- disabled={isDisabled}
|
|
|
|
|
- onChange={() => checkShareScopeRadioHandler(ShareScopeSwitchType.SAME_AS_ACCESS_SCOPE)}
|
|
|
|
|
- checked={selectedScope === ShareScopeSwitchType.SAME_AS_ACCESS_SCOPE}
|
|
|
|
|
- />
|
|
|
|
|
- <Label check for="shareAccess" className="d-flex flex-column">
|
|
|
|
|
- <span>ページのアクセス権限と同じ範囲</span>
|
|
|
|
|
- <small className="text-secondary">ページのアクセス権限と同じ範囲で共有されます</small>
|
|
|
|
|
- </Label>
|
|
|
|
|
- </FormGroup>
|
|
|
|
|
|
|
+ {[ShareScopeSwitchType.PUBLIC_ONLY, ShareScopeSwitchType.GROUPS, ShareScopeSwitchType.SAME_AS_ACCESS_SCOPE].map(shareScope => (
|
|
|
|
|
+ <FormGroup check key={shareScope}>
|
|
|
|
|
+ <Input
|
|
|
|
|
+ type="radio"
|
|
|
|
|
+ name="shareScope"
|
|
|
|
|
+ id="shareGroup"
|
|
|
|
|
+ className="form-check-input"
|
|
|
|
|
+ disabled={isDisabled}
|
|
|
|
|
+ onChange={() => checkShareScopeRadioHandler(shareScope)}
|
|
|
|
|
+ checked={selectedScope === shareScope}
|
|
|
|
|
+ />
|
|
|
|
|
+ <Label check for="shareGroup" className="d-flex flex-column">
|
|
|
|
|
+ <span>{t(`modal_ai_assistant.share_scope.${shareScope}.label`)}</span>
|
|
|
|
|
+ <small className="text-secondary">{t(`modal_ai_assistant.share_scope.${shareScope}.desc`)}</small>
|
|
|
|
|
+ </Label>
|
|
|
|
|
+ </FormGroup>
|
|
|
|
|
+ ))}
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
);
|
|
);
|