diff --git a/src/components/molecules/TagListFragment.tsx b/src/components/molecules/TagListFragment.tsx index 349566b19d..2cbf015ed2 100644 --- a/src/components/molecules/TagListFragment.tsx +++ b/src/components/molecules/TagListFragment.tsx @@ -1,5 +1,6 @@ import React, { useMemo } from 'react' import SideNavigatorItem from '../atoms/NavigatorItem' +import NavigatorButton from '../atoms/NavigatorButton' import { NoteStorage } from '../../lib/db/types' import { isTagNameValid } from '../../lib/db/utils' import { useGeneralStatus } from '../../lib/generalStatus' @@ -9,7 +10,7 @@ import { usePathnameWithoutNoteId } from '../../lib/routeParams' import { useDialog, DialogIconTypes } from '../../lib/dialog' import { useDb } from '../../lib/db' import { useTranslation } from 'react-i18next' -import { mdiPound, mdiTagMultiple } from '@mdi/js' +import { mdiPound, mdiTagMultiple, mdiDotsVertical } from '@mdi/js' import { openContextMenu } from '../../lib/electronOnly' import { useAnalytics, analyticsEvents } from '../../lib/analytics' @@ -30,6 +31,54 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => { const tagListNavItemId = getTagListItemId(storage.id) const tagListIsFolded = !sideNavOpenedItemSet.has(tagListNavItemId) + const openTagContextMenu = (tagName: string) => { + return (event: React.MouseEvent) => { + event.preventDefault() + openContextMenu({ + menuItems: [ + { + type: 'normal', + label: t('tag.remove'), + click: () => { + messageBox({ + title: `Remove "${tagName}" tag`, + message: t('tag.removeMessage'), + iconType: DialogIconTypes.Warning, + buttons: [t('tag.remove'), t('general.cancel')], + defaultButtonIndex: 0, + cancelButtonIndex: 1, + onClose: (value: number | null) => { + if (value === 0) { + removeTag(storageId, tagName) + report(analyticsEvents.removeTag) + } + }, + }) + }, + }, + { + type: 'normal', + label: t('tag.rename'), + click: () => { + prompt({ + title: `tag.rename`, + message: t('tag.renameMessage', { tagName }), + iconType: DialogIconTypes.Question, + defaultValue: tagName, + submitButtonLabel: t('tag.rename'), + onClose: (value: string | null) => { + if (value == null || !isTagNameValid(value) || value == tagName) return + renameTag(storageId, tagName, value); + report(analyticsEvents.renameTag) + }, + }) + }, + }, + ], + }) + } + } + const tagList = useMemo(() => { return Object.keys(tagMap).map((tagName) => { const tagPathname = `/app/storages/${storageId}/tags/${tagName}` @@ -44,52 +93,13 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => { push(tagPathname) }} active={tagIsActive} - onContextMenu={(event) => { - event.preventDefault() - openContextMenu({ - menuItems: [ - { - type: 'normal', - label: t('tag.remove'), - click: () => { - messageBox({ - title: `Remove "${tagName}" tag`, - message: t('tag.removeMessage'), - iconType: DialogIconTypes.Warning, - buttons: [t('tag.remove'), t('general.cancel')], - defaultButtonIndex: 0, - cancelButtonIndex: 1, - onClose: (value: number | null) => { - if (value === 0) { - removeTag(storageId, tagName) - report(analyticsEvents.removeTag) - } - }, - }) - }, - }, - { - type: 'normal', - label: t('tag.rename'), - click: () => { - prompt({ - title: `tag.rename`, - message: t('tag.renameMessage', { tagName }), - iconType: DialogIconTypes.Question, - defaultValue: tagName, - submitButtonLabel: t('tag.rename'), - onClose: (value: string | null) => { - if (value == null || !isTagNameValid(value) || value == tagName) return - renameTag(storageId, tagName, value); - report(analyticsEvents.renameTag) - // TODO: Test Mobile component in android studio. - }, - }) - }, - }, - ], - }) - }} + onContextMenu={openTagContextMenu(tagName)} + control={ + + } /> ) }) diff --git a/src/lib/db/PouchNoteDb.ts b/src/lib/db/PouchNoteDb.ts index e38d31f460..c4d851ebb4 100644 --- a/src/lib/db/PouchNoteDb.ts +++ b/src/lib/db/PouchNoteDb.ts @@ -271,7 +271,6 @@ export default class PouchNoteDb implements NoteDb { ...props, updatedAt: now, } - const { rev } = await this.pouchDb.put(tagDocProps) return { diff --git a/src/mobile/components/molecules/TagListFragment.tsx b/src/mobile/components/molecules/TagListFragment.tsx index 7f1846bb36..45e7039453 100644 --- a/src/mobile/components/molecules/TagListFragment.tsx +++ b/src/mobile/components/molecules/TagListFragment.tsx @@ -1,7 +1,6 @@ import React, { useMemo } from 'react' import NavigatorItem from '../atoms/NavigatorItem' import { NoteStorage } from '../../../lib/db/types' -import { isTagNameValid } from '../../../lib/db/utils' import { useGeneralStatus } from '../../lib/generalStatus' import { getTagListItemId } from '../../../lib/nav' import { useRouter, usePathnameWithoutNoteId } from '../../lib/router' @@ -20,8 +19,8 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => { const { id: storageId, tagMap } = storage const { push } = useRouter() const { popup } = useContextMenu() - const { messageBox, prompt } = useDialog() - const { removeTag, renameTag } = useDb() + const { messageBox } = useDialog() + const { removeTag } = useDb() const { t } = useTranslation() const currentPathname = usePathnameWithoutNoteId() @@ -67,23 +66,6 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => { }) }, }, - { - type: MenuTypes.Normal, - label: t('tag.rename'), - onClick: () => { - prompt({ - title: t('tag.rename'), - message: t('folder.renameMessage'), - iconType: DialogIconTypes.Question, - defaultValue: tagName, - submitButtonLabel: t('tag.rename'), - onClose: (value: string | null) => { - if (value == null || !isTagNameValid(value) || value == tagName) return - renameTag(storageId, tagName, value); - }, - }) - }, - }, ]) }} /> @@ -99,9 +81,6 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => { removeTag, t, toggleNav, - prompt, - isTagNameValid, - renameTag, ]) if (tagList.length === 0) {