Przeglądaj źródła

feat(page-create-modal): add template help link icon

Add a help icon (?) next to the template section heading in the
page create modal. Clicking it opens the template documentation
page, with the URL determined by whether the instance is GROWI
or GROWI.cloud.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
VANELLOPE\tomoyuki-t 2 tygodni temu
rodzic
commit
239c9ad92b

+ 18 - 1
apps/app/src/client/components/PageCreateModal.tsx

@@ -21,7 +21,7 @@ import { debounce } from 'throttle-debounce';
 import { useCreateTemplatePage } from '~/client/services/create-page';
 import { useCreateTemplatePage } from '~/client/services/create-page';
 import { useCreatePage } from '~/client/services/create-page/use-create-page';
 import { useCreatePage } from '~/client/services/create-page/use-create-page';
 import { useToastrOnError } from '~/client/services/use-toastr-on-error';
 import { useToastrOnError } from '~/client/services/use-toastr-on-error';
-import { useCurrentUser } from '~/states/global';
+import { useCurrentUser, useGrowiCloudUri } from '~/states/global';
 import { isSearchServiceReachableAtom } from '~/states/server-configurations';
 import { isSearchServiceReachableAtom } from '~/states/server-configurations';
 import {
 import {
   usePageCreateModalActions,
   usePageCreateModalActions,
@@ -38,6 +38,7 @@ const PageCreateModal: React.FC = () => {
   const { t } = useTranslation();
   const { t } = useTranslation();
 
 
   const currentUser = useCurrentUser();
   const currentUser = useCurrentUser();
+  const growiCloudUri = useGrowiCloudUri();
 
 
   const { isOpened, path: pathname = '' } = usePageCreateModalStatus();
   const { isOpened, path: pathname = '' } = usePageCreateModalStatus();
   const { close: closeCreateModal } = usePageCreateModalActions();
   const { close: closeCreateModal } = usePageCreateModalActions();
@@ -71,6 +72,11 @@ const PageCreateModal: React.FC = () => {
     [userHomepagePath, t, now],
     [userHomepagePath, t, now],
   );
   );
 
 
+  const templateHelpUrl =
+    growiCloudUri != null
+      ? 'https://growi.cloud/help/ja/guide/features/template.html'
+      : 'https://docs.growi.org/ja/guide/features/template.html';
+
   const [todayInput, setTodayInput] = useState('');
   const [todayInput, setTodayInput] = useState('');
   const [pageNameInput, setPageNameInput] = useState(pageNameInputInitialValue);
   const [pageNameInput, setPageNameInput] = useState(pageNameInputInitialValue);
   const [template, setTemplate] = useState(null);
   const [template, setTemplate] = useState(null);
@@ -295,6 +301,16 @@ const PageCreateModal: React.FC = () => {
         <fieldset className="col-12">
         <fieldset className="col-12">
           <h3 className="pb-2">
           <h3 className="pb-2">
             {t('template.modal_label.Create template under')}
             {t('template.modal_label.Create template under')}
+            <a
+              href={templateHelpUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="ms-1"
+            >
+              <span className="material-symbols-outlined fs-6 text-secondary">
+                help
+              </span>
+            </a>
             <br />
             <br />
             <code className="h6" data-testid="grw-page-create-modal-path-name">
             <code className="h6" data-testid="grw-page-create-modal-path-name">
               {pathname}
               {pathname}
@@ -353,6 +369,7 @@ const PageCreateModal: React.FC = () => {
     isOpened,
     isOpened,
     pathname,
     pathname,
     template,
     template,
+    templateHelpUrl,
     onChangeTemplateHandler,
     onChangeTemplateHandler,
     createTemplateWithToastr,
     createTemplateWithToastr,
     t,
     t,