|
|
@@ -1,29 +1,33 @@
|
|
|
import React, { useCallback, useState } from 'react';
|
|
|
|
|
|
+import { pagePathUtils } from '@growi/core/dist/utils';
|
|
|
+import { format } from 'date-fns';
|
|
|
import { useRouter } from 'next/router';
|
|
|
|
|
|
-import { createPage } from '~/client/services/page-operation';
|
|
|
+import { createPage, exist } from '~/client/services/page-operation';
|
|
|
import { toastError } from '~/client/util/toastr';
|
|
|
+import { useCurrentUser } from '~/stores/context';
|
|
|
import { useSWRxCurrentPage } from '~/stores/page';
|
|
|
import loggerFactory from '~/utils/logger';
|
|
|
|
|
|
+import { PageCreateButtonDropdownMenu } from './PageCreateButtonDropdownMenu';
|
|
|
import { CreateButton } from './CreateButton';
|
|
|
import { DropendToggle } from './DropendToggle';
|
|
|
|
|
|
-import styles from './PageCreateButton.module.scss';
|
|
|
-
|
|
|
-const moduleClass = styles['grw-page-create-button'];
|
|
|
-
|
|
|
-
|
|
|
const logger = loggerFactory('growi:cli:PageCreateButton');
|
|
|
|
|
|
export const PageCreateButton = React.memo((): JSX.Element => {
|
|
|
const router = useRouter();
|
|
|
const { data: currentPage, isLoading } = useSWRxCurrentPage();
|
|
|
+ const { data: currentUser } = useCurrentUser();
|
|
|
|
|
|
const [isHovered, setIsHovered] = useState(false);
|
|
|
const [isCreating, setIsCreating] = useState(false);
|
|
|
|
|
|
+ const now = format(new Date(), 'yyyy/MM/dd');
|
|
|
+ const userHomepagePath = pagePathUtils.userHomepagePath(currentUser);
|
|
|
+ const todaysPath = `${userHomepagePath}/memo/${now}`;
|
|
|
+
|
|
|
const onMouseEnterHandler = () => {
|
|
|
setIsHovered(true);
|
|
|
};
|
|
|
@@ -32,7 +36,7 @@ export const PageCreateButton = React.memo((): JSX.Element => {
|
|
|
setIsHovered(false);
|
|
|
};
|
|
|
|
|
|
- const onCreateNewPageButtonHandler = useCallback(async() => {
|
|
|
+ const onClickCreateNewPageButtonHandler = useCallback(async() => {
|
|
|
if (isLoading) return;
|
|
|
|
|
|
try {
|
|
|
@@ -63,86 +67,139 @@ export const PageCreateButton = React.memo((): JSX.Element => {
|
|
|
setIsCreating(false);
|
|
|
}
|
|
|
}, [currentPage, isLoading, router]);
|
|
|
- const onCreateTodaysButtonHandler = useCallback(() => {
|
|
|
- // router.push(`${router.pathname}#edit`);
|
|
|
- }, [router]);
|
|
|
- const onTemplateForChildrenButtonHandler = useCallback(() => {
|
|
|
- // router.push(`${router.pathname}/_template#edit`);
|
|
|
- }, [router]);
|
|
|
- const onTemplateForDescendantsButtonHandler = useCallback(() => {
|
|
|
- // router.push(`${router.pathname}/__template#edit`);
|
|
|
- }, [router]);
|
|
|
-
|
|
|
- // TODO: i18n
|
|
|
- // https://redmine.weseek.co.jp/issues/132681
|
|
|
+
|
|
|
+ const onClickCreateTodaysButtonHandler = useCallback(async() => {
|
|
|
+ if (currentUser == null) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ try {
|
|
|
+ setIsCreating(true);
|
|
|
+
|
|
|
+ // TODO: get grant, grantUserGroupId data from parent page
|
|
|
+ // https://redmine.weseek.co.jp/issues/133892
|
|
|
+ const params = {
|
|
|
+ isSlackEnabled: false,
|
|
|
+ slackChannels: '',
|
|
|
+ grant: 1,
|
|
|
+ pageTags: [],
|
|
|
+ };
|
|
|
+
|
|
|
+ const res = await exist(JSON.stringify([todaysPath]));
|
|
|
+ if (!res.pages[todaysPath]) {
|
|
|
+ await createPage(todaysPath, '', params);
|
|
|
+ }
|
|
|
+
|
|
|
+ router.push(`${todaysPath}#edit`);
|
|
|
+ }
|
|
|
+ catch (err) {
|
|
|
+ logger.warn(err);
|
|
|
+ toastError(err);
|
|
|
+ }
|
|
|
+ finally {
|
|
|
+ setIsCreating(false);
|
|
|
+ }
|
|
|
+ }, [currentUser, router, todaysPath]);
|
|
|
+
|
|
|
+ const onClickTemplateForChildrenButtonHandler = useCallback(async() => {
|
|
|
+ if (isLoading) return;
|
|
|
+
|
|
|
+ try {
|
|
|
+ setIsCreating(true);
|
|
|
+
|
|
|
+ const path = currentPage == null || currentPage.path === '/'
|
|
|
+ ? '/_template'
|
|
|
+ : `${currentPage.path}/_template`;
|
|
|
+
|
|
|
+ const params = {
|
|
|
+ isSlackEnabled: false,
|
|
|
+ slackChannels: '',
|
|
|
+ grant: currentPage?.grant || 1,
|
|
|
+ pageTags: [],
|
|
|
+ grantUserGroupId: currentPage?.grantedGroup?._id,
|
|
|
+ };
|
|
|
+
|
|
|
+ const res = await exist(JSON.stringify([path]));
|
|
|
+ if (!res.pages[path]) {
|
|
|
+ await createPage(path, '', params);
|
|
|
+ }
|
|
|
+
|
|
|
+ router.push(`${path}#edit`);
|
|
|
+ }
|
|
|
+ catch (err) {
|
|
|
+ logger.warn(err);
|
|
|
+ toastError(err);
|
|
|
+ }
|
|
|
+ finally {
|
|
|
+ setIsCreating(false);
|
|
|
+ }
|
|
|
+ }, [currentPage, isLoading, router]);
|
|
|
+
|
|
|
+ const onClickTemplateForDescendantsButtonHandler = useCallback(async() => {
|
|
|
+ if (isLoading) return;
|
|
|
+
|
|
|
+ try {
|
|
|
+ setIsCreating(true);
|
|
|
+
|
|
|
+ const path = currentPage == null || currentPage.path === '/'
|
|
|
+ ? '/__template'
|
|
|
+ : `${currentPage.path}/__template`;
|
|
|
+
|
|
|
+ const params = {
|
|
|
+ isSlackEnabled: false,
|
|
|
+ slackChannels: '',
|
|
|
+ grant: currentPage?.grant || 1,
|
|
|
+ pageTags: [],
|
|
|
+ grantUserGroupId: currentPage?.grantedGroup?._id,
|
|
|
+ };
|
|
|
+
|
|
|
+ const res = await exist(JSON.stringify([path]));
|
|
|
+ if (!res.pages[path]) {
|
|
|
+ await createPage(path, '', params);
|
|
|
+ }
|
|
|
+
|
|
|
+ router.push(`${path}#edit`);
|
|
|
+ }
|
|
|
+ catch (err) {
|
|
|
+ logger.warn(err);
|
|
|
+ toastError(err);
|
|
|
+ }
|
|
|
+ finally {
|
|
|
+ setIsCreating(false);
|
|
|
+ }
|
|
|
+ }, [currentPage, isLoading, router]);
|
|
|
+
|
|
|
+ // TODO: update button design
|
|
|
+ // https://redmine.weseek.co.jp/issues/132683
|
|
|
return (
|
|
|
<div
|
|
|
- className={`${moduleClass} d-flex flex-row`}
|
|
|
+ className="d-flex flex-row"
|
|
|
onMouseEnter={onMouseEnterHandler}
|
|
|
onMouseLeave={onMouseLeaveHandler}
|
|
|
>
|
|
|
<div className="btn-group flex-grow-1">
|
|
|
<CreateButton
|
|
|
className="z-2"
|
|
|
- onClick={onCreateNewPageButtonHandler}
|
|
|
+ onClick={onClickCreateNewPageButtonHandler}
|
|
|
disabled={isCreating}
|
|
|
/>
|
|
|
</div>
|
|
|
- { isHovered && (
|
|
|
+ {isHovered && (
|
|
|
<div className="btn-group dropend position-absolute">
|
|
|
<DropendToggle
|
|
|
className="dropdown-toggle dropdown-toggle-split"
|
|
|
data-bs-toggle="dropdown"
|
|
|
aria-expanded="false"
|
|
|
/>
|
|
|
- <ul className="dropdown-menu">
|
|
|
- <li>
|
|
|
- <button
|
|
|
- className="dropdown-item"
|
|
|
- onClick={onCreateNewPageButtonHandler}
|
|
|
- type="button"
|
|
|
- disabled={isCreating}
|
|
|
- >
|
|
|
- Create New Page
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- <li><hr className="dropdown-divider" /></li>
|
|
|
- <li><span className="text-muted px-3">Create today's ...</span></li>
|
|
|
- {/* TODO: show correct create today's page path */}
|
|
|
- {/* https://redmine.weseek.co.jp/issues/132682 */}
|
|
|
- <li>
|
|
|
- <button
|
|
|
- className="dropdown-item"
|
|
|
- onClick={onCreateTodaysButtonHandler}
|
|
|
- type="button"
|
|
|
- >
|
|
|
- Create today's
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- <li><hr className="dropdown-divider" /></li>
|
|
|
- <li><span className="text-muted px-3">Child page template</span></li>
|
|
|
- <li>
|
|
|
- <button
|
|
|
- className="dropdown-item"
|
|
|
- onClick={onTemplateForChildrenButtonHandler}
|
|
|
- type="button"
|
|
|
- >
|
|
|
- Template for children
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <button
|
|
|
- className="dropdown-item"
|
|
|
- onClick={onTemplateForDescendantsButtonHandler}
|
|
|
- type="button"
|
|
|
- >
|
|
|
- Template for descendants
|
|
|
- </button>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <PageCreateButtonDropdownMenu
|
|
|
+ todaysPath={todaysPath}
|
|
|
+ onClickCreateNewPageButtonHandler={onClickCreateNewPageButtonHandler}
|
|
|
+ onClickCreateTodaysButtonHandler={onClickCreateTodaysButtonHandler}
|
|
|
+ onClickTemplateForChildrenButtonHandler={onClickTemplateForChildrenButtonHandler}
|
|
|
+ onClickTemplateForDescendantsButtonHandler={onClickTemplateForDescendantsButtonHandler}
|
|
|
+ />
|
|
|
</div>
|
|
|
)}
|
|
|
</div>
|
|
|
);
|
|
|
});
|
|
|
-PageCreateButton.displayName = 'PageCreateButton';
|