mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2024-11-26 03:33:58 -05:00
fix(pinning): Use new object for redux mutations
Elements retrieved from the redux state must not be manipulated. Instead, a new object is created with the adjusted properties and committed to the redux store. A missing css class has been additionally added, so that the pinning state can be deduced from the color of the sidebar icon. Signed-off-by: Erik Michelson <github@erik.michelson.eu>
This commit is contained in:
parent
761f112491
commit
d57b2f27fd
3 changed files with 17 additions and 7 deletions
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
|
||||
*
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
.highlighted {
|
||||
color: #b51f08 !important;
|
||||
}
|
|
@ -11,6 +11,7 @@ import type { SpecificSidebarEntryProps } from '../types'
|
|||
import { toggleHistoryEntryPinning } from '../../../../redux/history/methods'
|
||||
import { showErrorNotification } from '../../../../redux/ui-notifications/methods'
|
||||
import { useApplicationState } from '../../../../hooks/common/use-application-state'
|
||||
import styles from './pin-note-sidebar-entry.module.css'
|
||||
|
||||
/**
|
||||
* Sidebar entry button that toggles the pinned status of the current note in the history.
|
||||
|
@ -40,7 +41,7 @@ export const PinNoteSidebarEntry: React.FC<SpecificSidebarEntryProps> = ({ class
|
|||
icon={'thumb-tack'}
|
||||
hide={hide}
|
||||
onClick={onPinClicked}
|
||||
className={`${className ?? ''} ${isPinned ? 'icon-highlighted' : ''}`}>
|
||||
className={`${className ?? ''} ${isPinned ? styles['highlighted'] : ''}`}>
|
||||
<Trans i18nKey={isPinned ? 'editor.documentBar.pinnedToHistory' : 'editor.documentBar.pinNoteToHistory'} />
|
||||
</SidebarButton>
|
||||
)
|
||||
|
|
|
@ -106,15 +106,15 @@ export const toggleHistoryEntryPinning = async (noteId: string): Promise<void> =
|
|||
if (!entryToUpdate) {
|
||||
return Promise.reject(`History entry for note '${noteId}' not found`)
|
||||
}
|
||||
if (entryToUpdate.pinStatus === undefined) {
|
||||
entryToUpdate.pinStatus = false
|
||||
const updatedEntry = {
|
||||
...entryToUpdate,
|
||||
pinStatus: !entryToUpdate.pinStatus
|
||||
}
|
||||
entryToUpdate.pinStatus = !entryToUpdate.pinStatus
|
||||
if (entryToUpdate.origin === HistoryEntryOrigin.LOCAL) {
|
||||
updateLocalHistoryEntry(noteId, entryToUpdate)
|
||||
updateLocalHistoryEntry(noteId, updatedEntry)
|
||||
} else {
|
||||
await updateRemoteHistoryEntryPinStatus(noteId, entryToUpdate.pinStatus)
|
||||
updateHistoryEntryRedux(noteId, entryToUpdate)
|
||||
await updateRemoteHistoryEntryPinStatus(noteId, updatedEntry.pinStatus)
|
||||
updateHistoryEntryRedux(noteId, updatedEntry)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue