editor.tsx 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. import { useCallback } from 'react';
  2. import { Nullable, withUtils, SWRResponseWithUtils } from '@growi/core';
  3. import useSWR, { SWRResponse } from 'swr';
  4. import useSWRImmutable from 'swr/immutable';
  5. import { apiGet } from '~/client/util/apiv1-client';
  6. import { apiv3Get, apiv3Put } from '~/client/util/apiv3-client';
  7. import { IEditorSettings } from '~/interfaces/editor-settings';
  8. import { SlackChannels } from '~/interfaces/user-trigger-notification';
  9. import {
  10. useCurrentPathname,
  11. useCurrentUser, useDefaultIndentSize, useIsGuestUser,
  12. } from './context';
  13. // import { localStorageMiddleware } from './middlewares/sync-to-storage';
  14. import { useSWRxTagsInfo } from './page';
  15. import { useStaticSWR } from './use-static-swr';
  16. export const useEditingMarkdown = (initialData?: string): SWRResponse<string, Error> => {
  17. // need to include useCurrentPathname not useCurrentPagePath
  18. // https://github.com/weseek/growi/pull/7301
  19. const { data: currentPagePath } = useCurrentPathname();
  20. return useStaticSWR(['editingMarkdown', currentPagePath], initialData);
  21. };
  22. type EditorSettingsOperation = {
  23. update: (updateData: Partial<IEditorSettings>) => Promise<void>,
  24. turnOffAskingBeforeDownloadLargeFiles: () => void,
  25. }
  26. // TODO: Enable localStorageMiddleware
  27. // - Unabling localStorageMiddleware occurrs a flickering problem when loading theme.
  28. // - see: https://github.com/weseek/growi/pull/6781#discussion_r1000285786
  29. export const useEditorSettings = (): SWRResponseWithUtils<EditorSettingsOperation, IEditorSettings, Error> => {
  30. const { data: currentUser } = useCurrentUser();
  31. const { data: isGuestUser } = useIsGuestUser();
  32. const swrResult = useSWRImmutable<IEditorSettings>(
  33. isGuestUser ? null : ['/personal-setting/editor-settings', currentUser?.username],
  34. endpoint => apiv3Get(endpoint).then(result => result.data),
  35. {
  36. // use: [localStorageMiddleware], // store to localStorage for initialization fastly
  37. // fallbackData: undefined,
  38. },
  39. );
  40. return withUtils<EditorSettingsOperation, IEditorSettings, Error>(swrResult, {
  41. update: async(updateData) => {
  42. const { data, mutate } = swrResult;
  43. if (data == null) {
  44. return;
  45. }
  46. mutate({ ...data, ...updateData }, false);
  47. // invoke API
  48. await apiv3Put('/personal-setting/editor-settings', updateData);
  49. },
  50. turnOffAskingBeforeDownloadLargeFiles: async() => {
  51. const { data, mutate } = swrResult;
  52. if (data == null) {
  53. return;
  54. }
  55. // invoke API
  56. await apiv3Put('/personal-setting/editor-settings', { textlintSettings: { neverAskBeforeDownloadLargeFiles: true } });
  57. // revalidate
  58. mutate();
  59. },
  60. });
  61. };
  62. export const useIsTextlintEnabled = (): SWRResponse<boolean, Error> => {
  63. return useStaticSWR<boolean, Error>('isTextlintEnabled', undefined, { fallbackData: false });
  64. };
  65. export const useCurrentIndentSize = (): SWRResponse<number, Error> => {
  66. const { data: defaultIndentSize } = useDefaultIndentSize();
  67. return useStaticSWR<number, Error>(
  68. defaultIndentSize == null ? null : 'currentIndentSize',
  69. undefined,
  70. { fallbackData: defaultIndentSize },
  71. );
  72. };
  73. /*
  74. * Slack Notification
  75. */
  76. export const useSWRxSlackChannels = (currentPagePath: Nullable<string>): SWRResponse<string[], Error> => {
  77. const shouldFetch: boolean = currentPagePath != null;
  78. return useSWRImmutable(
  79. shouldFetch ? ['/pages.updatePost', currentPagePath] : null,
  80. (endpoint, path) => apiGet(endpoint, { path }).then((response: SlackChannels) => response.updatePost),
  81. { fallbackData: [''] },
  82. );
  83. };
  84. export const useIsSlackEnabled = (): SWRResponse<boolean, Error> => {
  85. return useStaticSWR(
  86. 'isSlackEnabled',
  87. undefined,
  88. { fallbackData: false },
  89. );
  90. };
  91. export type IPageTagsForEditorsOption = {
  92. sync: (tags?: string[]) => void;
  93. }
  94. export const usePageTagsForEditors = (pageId: Nullable<string>): SWRResponse<string[], Error> & IPageTagsForEditorsOption => {
  95. const { data: tagsInfoData } = useSWRxTagsInfo(pageId);
  96. const swrResult = useStaticSWR<string[], Error>('pageTags', undefined);
  97. const { mutate } = swrResult;
  98. const sync = useCallback((): void => {
  99. mutate(tagsInfoData?.tags || [], false);
  100. }, [mutate, tagsInfoData?.tags]);
  101. return {
  102. ...swrResult,
  103. sync,
  104. };
  105. };
  106. export const useIsEnabledUnsavedWarning = (): SWRResponse<boolean, Error> => {
  107. return useStaticSWR<boolean, Error>('isEnabledUnsavedWarning');
  108. };
  109. export const useIsConflict = (): SWRResponse<boolean, Error> => {
  110. return useStaticSWR<boolean, Error>('isConflict', undefined, { fallbackData: false });
  111. };