From 2743268fd74a2fc3c00252836b540505b9ece3db Mon Sep 17 00:00:00 2001 From: boojack Date: Sun, 13 Nov 2022 10:47:21 +0800 Subject: [PATCH] chore: remove unused visibility selector (#457) --- web/src/components/MemoCardDialog.tsx | 37 +----------------- web/src/components/MemoEditor.tsx | 2 +- web/src/less/explore.less | 10 +---- web/src/less/memo-card-dialog.less | 20 ---------- web/src/less/memo-detail.less | 30 +-------------- web/src/less/memo-editor.less | 2 +- web/src/pages/Explore.tsx | 3 +- web/src/pages/MemoDetail.tsx | 54 ++------------------------- 8 files changed, 12 insertions(+), 146 deletions(-) diff --git a/web/src/components/MemoCardDialog.tsx b/web/src/components/MemoCardDialog.tsx index 529d2be3..e6e574d3 100644 --- a/web/src/components/MemoCardDialog.tsx +++ b/web/src/components/MemoCardDialog.tsx @@ -3,7 +3,7 @@ import { useState, useEffect, useCallback } from "react"; import { useTranslation } from "react-i18next"; import { editorStateService, memoService, userService } from "../services"; import { useAppSelector } from "../store"; -import { UNKNOWN_ID, VISIBILITY_SELECTOR_ITEMS } from "../helpers/consts"; +import { UNKNOWN_ID } from "../helpers/consts"; import * as utils from "../helpers/utils"; import { parseHTMLToRawText } from "../helpers/utils"; import { marked } from "../labs/marked"; @@ -11,7 +11,6 @@ import { MARK_REG } from "../labs/marked/parser"; import toastHelper from "./Toast"; import { generateDialog } from "./Dialog"; import Icon from "./Icon"; -import Selector from "./common/Selector"; import MemoContent from "./MemoContent"; import MemoResources from "./MemoResources"; import showChangeMemoCreatedTsDialog from "./ChangeMemoCreatedTsDialog"; @@ -35,12 +34,6 @@ const MemoCardDialog: React.FC = (props: Props) => { const [linkMemos, setLinkMemos] = useState([]); const [linkedMemos, setLinkedMemos] = useState([]); const isVisitorMode = userService.isVisitorMode(); - const visibilitySelectorItems = VISIBILITY_SELECTOR_ITEMS.map((item) => { - return { - value: item.value, - text: t(`memo.visibility.${item.text.toLowerCase()}`), - }; - }); useEffect(() => { const fetchLinkedMemos = async () => { @@ -138,36 +131,8 @@ const MemoCardDialog: React.FC = (props: Props) => { toastHelper.success(t("message.succeed-copy-content")); }; - const handleVisibilitySelectorChange = async (visibility: Visibility) => { - if (memo.visibility === visibility) { - return; - } - - await memoService.patchMemo({ - id: memo.id, - visibility: visibility, - }); - setMemo({ - ...memo, - visibility: visibility, - }); - }; - return ( <> - {!isVisitorMode && ( -
-
- - handleVisibilitySelectorChange(value as Visibility)} - /> -
-
- )}

diff --git a/web/src/components/MemoEditor.tsx b/web/src/components/MemoEditor.tsx index 2f417b07..a0e77142 100644 --- a/web/src/components/MemoEditor.tsx +++ b/web/src/components/MemoEditor.tsx @@ -482,7 +482,7 @@ const MemoEditor = () => { )}

.memo-header { - @apply mb-2 w-full flex flex-row justify-start items-center text-sm font-mono text-gray-400; - - > .split-text { - @apply mx-2; - } + @apply mb-2 w-full flex flex-row justify-start items-center text-sm text-gray-400; > .name-text { - @apply hover:text-green-600 hover:underline; + @apply ml-2 hover:text-green-600 hover:underline; } } diff --git a/web/src/less/memo-card-dialog.less b/web/src/less/memo-card-dialog.less index c72b8cdb..0d6fbbcd 100644 --- a/web/src/less/memo-card-dialog.less +++ b/web/src/less/memo-card-dialog.less @@ -6,26 +6,6 @@ > .dialog-container { @apply w-full p-0 bg-transparent flex flex-col justify-start items-center; - > .card-header-container { - @apply z-10 w-128 max-w-full flex flex-row justify-start items-center mb-2; - - > .visibility-selector-container { - @apply bg-white px-2 pl-3 py-1 rounded-lg flex flex-row justify-start items-center; - - > .icon-img { - @apply mr-1 w-4 h-auto; - } - - > .visibility-selector { - @apply w-32; - - > .current-value-container { - @apply border-none; - } - } - } - } - > .memo-card-container { @apply flex flex-col justify-start items-start relative w-128 max-w-full py-3 px-6 mb-3 rounded-lg bg-yellow-200; diff --git a/web/src/less/memo-detail.less b/web/src/less/memo-detail.less index 94e9f0c7..e0ca83a6 100644 --- a/web/src/less/memo-detail.less +++ b/web/src/less/memo-detail.less @@ -1,5 +1,3 @@ -@import "./mixin.less"; - .page-wrapper.memo-detail { @apply relative top-0 w-full h-screen overflow-y-auto overflow-x-hidden; background-color: #f6f5f4; @@ -44,34 +42,10 @@ @apply mb-2 w-full flex flex-row justify-between items-center; > .status-container { - @apply flex flex-row justify-start items-center text-sm font-mono text-gray-400; - - > .split-text { - @apply mx-2; - } + @apply flex flex-row justify-start items-center text-sm text-gray-400; > .name-text { - @apply hover:text-green-600 hover:underline; - } - - > .visibility-selector { - @apply ml-2; - - > .status-text { - @apply flex flex-row justify-start items-center leading-5 text-xs cursor-pointer ml-2 rounded border px-1; - - &.public { - @apply border-green-600 text-green-600; - } - - &.protected { - @apply border-gray-400 text-gray-400; - } - } - - .action-button { - @apply px-2 leading-7 w-full rounded text-gray-600 hover:bg-gray-100; - } + @apply ml-2 hover:text-green-600 hover:underline; } } } diff --git a/web/src/less/memo-editor.less b/web/src/less/memo-editor.less index 19f7db16..647f3d2e 100644 --- a/web/src/less/memo-editor.less +++ b/web/src/less/memo-editor.less @@ -51,7 +51,7 @@ } > .common-tools-wrapper { - @apply relative w-full flex flex-row justify-between items-center pt-2; + @apply relative w-full flex flex-row justify-between items-center pt-2 z-1; > .common-tools-container { @apply flex flex-row justify-start items-center; diff --git a/web/src/pages/Explore.tsx b/web/src/pages/Explore.tsx index f8438902..235c2268 100644 --- a/web/src/pages/Explore.tsx +++ b/web/src/pages/Explore.tsx @@ -82,9 +82,8 @@ const Explore = () => {
undefined} /> diff --git a/web/src/pages/MemoDetail.tsx b/web/src/pages/MemoDetail.tsx index 17275e17..2323e0ae 100644 --- a/web/src/pages/MemoDetail.tsx +++ b/web/src/pages/MemoDetail.tsx @@ -48,24 +48,6 @@ const MemoDetail = () => { } }, [location]); - const handleVisibilitySelectorChange = async (visibility: Visibility) => { - if (state.memo.visibility === visibility) { - return; - } - - await memoService.patchMemo({ - id: state.memo.id, - visibility: visibility, - }); - setState({ - ...state, - memo: { - ...state.memo, - visibility: visibility, - }, - }); - }; - const handleCopyContent = () => { copy(state.memo.content); toastHelper.success(t("message.succeed-copy-content")); @@ -100,37 +82,9 @@ const MemoDetail = () => {
{dayjs(state.memo.displayTs).locale(i18n.language).format("YYYY/MM/DD HH:mm:ss")} - {user?.id === state.memo.creatorId ? ( - - {state.memo.visibility} - - } - actions={ - <> - handleVisibilitySelectorChange("PRIVATE")}> - Private - - handleVisibilitySelectorChange("PROTECTED")}> - Protected - - handleVisibilitySelectorChange("PUBLIC")}> - Public - - - } - actionsClassName="!w-28 !left-0 !p-1" - /> - ) : ( - <> - by - - {state.memo.creator.name} - - - )} + + @{state.memo.creator.name} +
} @@ -141,7 +95,7 @@ const MemoDetail = () => { className="w-full flex flex-row justify-start items-center px-3 whitespace-nowrap text-sm text-left leading-8 cursor-pointer rounded hover:bg-gray-100" onClick={handleCopyContent} > - {t("memo.copy")} + {t("memo.copy")} }