imprv/115673-128224-create-presentationfile15.0

apps/app/public/static/locales/ja_JP/admin.json

@@ -492,7 +492,7 @@
 
     },
     "presentation":"プレゼンテーション",
-    "Presentation_options":{
+    "presentation_options":{
       "enable_marp": "Marp を有効化する",
       "enable_marp_desc": "プレゼンテーション表示に Marp を利用できるようになります。ただし、XSS に対して脆弱になる恐れがあります。",
       "marp_official_site": "参考：Marp 公式サイト",

apps/app/src/components/Admin/Customize/CustomizePresentationSetting.tsx

@@ -1,50 +1,66 @@
 import React, { useCallback } from 'react';
 
-import { StatsEvent } from '@aws-sdk/client-s3';
-import { Presentation } from '@growi/presentation';
 import { t } from 'i18next';
-import { useTranslation } from 'next-i18next';
 
 import AdminCustomizeContainer from '~/client/services/AdminCustomizeContainer';
 import { toastSuccess, toastError } from '~/client/util/toastr';
 
+import { withUnstatedContainers } from '../../UnstatedUtils';
 import AdminUpdateButtonRow from '../Common/AdminUpdateButtonRow';
 
+import CustomizePresentationOption from './CustomizeFunctionOption';
+
 type Props = {
   adminCustomizeContainer: AdminCustomizeContainer
 }
 
 export const CustomizePresentationSetting = (props: Props): JSX.Element => {
   const { adminCustomizeContainer } = props;
+  const onClickSubmit = useCallback(async() => {
+    try {
+      await adminCustomizeContainer.updateCustomizeFunction();
+      toastSuccess(t('toaster.update_successed', { target: t('admin:customize_settings.function'), ns: 'commons' }));
+    }
+    catch (err) {
+      toastError(err);
+    }
+  }, [adminCustomizeContainer]);
   return (
     <React.Fragment>
       <h2 className="admin-setting-header">{t('presentation')}</h2>
       <div className="form-group row">
-          { optionId = 'isEnabledMarp' }
-            label={t('admin:customize_settings.presentation_options.enable_marp')}
-            isChecked={adminCustomizeContainer.state.isEnabledMarp || false}
+        <div className="offset-md-3 col-md-6 text-left">
+          <CustomizePresentationOption
+            optionId="isEnabledMarp"
+            label={t('admin:customize_settings.function_options.enable_marp')}
+            isChecked={adminCustomizeContainer?.state.isEnabledMarp || false}
             onChecked={() => { adminCustomizeContainer.switchIsEnabledMarp() }}
-          <p className="form-text text-muted">
-            {t('admin:customize_settings.presentation_options.enable_marp_desc')}
-            <br></br>
-            <a
-              href={`${t('admin:customize_settings.presentation_options.marp_official_site_link')}`}
-              target="_blank"
-              rel="noopener noreferrer"
-            >{`${t('admin:customize_settings.presentation_options.marp_official_site')}`}
-            </a>
-            <br></br>
-            <a
-              href={`${t('admin:customize_settings.presentation_options.marp_in_gorwi_link')}`}
-              target="_blank"
-              rel="noopener noreferrer"
-            >{`${t('admin:customize_settings.presentation_options.marp_in_growi')}`}
-            </a>
-          </p>
-
+          >
+            <p className="form-text text-muted">
+              {t('admin:customize_settings.presentation_options.enable_marp_desc')}
+              <br></br>
+              <a
+                href={`${t('admin:customize_settings.presentation_options.marp_official_site_link')}`}
+                target="_blank"
+                rel="noopener noreferrer"
+              >{`${t('admin:customize_settings.presentation_options.marp_official_site')}`}
+              </a>
+              <br></br>
+              <a
+                href={`${t('admin:customize_settings.presentation_options.marp_in_gorwi_link')}`}
+                target="_blank"
+                rel="noopener noreferrer"
+              >{`${t('admin:customize_settings.presenattion_options.marp_in_growi')}`}
+              </a>
+            </p>
+          </CustomizePresentationOption>
         </div>
       </div>
-    // <adminUpdateButtonRow onClick={onClickSubmit} disabled={adminCustomizeContainer.state.retrieveError != null} />
+
+      <AdminUpdateButtonRow onClick={onClickSubmit} disabled={adminCustomizeContainer.state.retrieveError != null} />
     </React.Fragment>
   );
 };
+const CustomizePresentationSettingWrapper = withUnstatedContainers(CustomizePresentationSetting, [AdminCustomizeContainer]);
+
+export default CustomizePresentationSettingWrapper;