chore: Simplify comment sidebar persistence to be per-user (#8022)

This commit is contained in:
Tom Moor
2024-11-26 20:24:07 -05:00
committed by GitHub
parent 4579594c63
commit 816a6715c5
6 changed files with 10 additions and 30 deletions

View File

@@ -1054,7 +1054,7 @@ export const openDocumentComments = createAction({
return; return;
} }
stores.ui.toggleComments(activeDocumentId); stores.ui.toggleComments();
}, },
}); });

View File

@@ -94,7 +94,7 @@ const AuthenticatedLayout: React.FC = ({ children }: Props) => {
!showHistory && !showHistory &&
can.comment && can.comment &&
ui.activeDocumentId && ui.activeDocumentId &&
ui.commentsExpanded.includes(ui.activeDocumentId) && ui.commentsExpanded &&
team.getPreference(TeamPreference.Commenting); team.getPreference(TeamPreference.Commenting);
const sidebarRight = ( const sidebarRight = (

View File

@@ -44,7 +44,7 @@ function Comments() {
const isAtBottom = React.useRef(true); const isAtBottom = React.useRef(true);
const [showJumpToRecentBtn, setShowJumpToRecentBtn] = React.useState(false); const [showJumpToRecentBtn, setShowJumpToRecentBtn] = React.useState(false);
useKeyDown("Escape", () => document && ui.collapseComments(document?.id)); useKeyDown("Escape", () => document && ui.set({ commentsExpanded: false }));
const [draft, onSaveDraft] = usePersistedState<ProsemirrorData | undefined>( const [draft, onSaveDraft] = usePersistedState<ProsemirrorData | undefined>(
`draft-${document?.id}-new`, `draft-${document?.id}-new`,
@@ -126,7 +126,7 @@ function Comments() {
<CommentSortMenu /> <CommentSortMenu />
</Flex> </Flex>
} }
onClose={() => ui.collapseComments(document?.id)} onClose={() => ui.set({ commentsExpanded: false })}
scrollable={false} scrollable={false}
> >
<Scrollable <Scrollable

View File

@@ -46,7 +46,7 @@ function TitleDocumentMeta({ to, document, revision, ...rest }: Props) {
&nbsp;&nbsp; &nbsp;&nbsp;
<CommentLink <CommentLink
to={documentPath(document)} to={documentPath(document)}
onClick={() => ui.toggleComments(document.id)} onClick={() => ui.toggleComments()}
> >
<CommentIcon size={18} /> <CommentIcon size={18} />
{commentsCount {commentsCount

View File

@@ -116,7 +116,7 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
state: { commentId: focusedComment.id }, state: { commentId: focusedComment.id },
}); });
} }
ui.expandComments(document.id); ui.set({ commentsExpanded: true });
} }
}, [focusedComment, ui, document.id, history, params]); }, [focusedComment, ui, document.id, history, params]);

View File

@@ -75,7 +75,7 @@ class UiStore {
sidebarCollapsed = false; sidebarCollapsed = false;
@observable @observable
commentsExpanded: string[] = []; commentsExpanded = false;
@observable @observable
sidebarIsResizing = false; sidebarIsResizing = false;
@@ -99,7 +99,7 @@ class UiStore {
this.sidebarRightWidth = this.sidebarRightWidth =
data.sidebarRightWidth || defaultTheme.sidebarRightWidth; data.sidebarRightWidth || defaultTheme.sidebarRightWidth;
this.tocVisible = data.tocVisible; this.tocVisible = data.tocVisible;
this.commentsExpanded = data.commentsExpanded || []; this.commentsExpanded = !!data.commentsExpanded;
this.theme = data.theme || Theme.System; this.theme = data.theme || Theme.System;
// system theme listeners // system theme listeners
@@ -218,28 +218,8 @@ class UiStore {
}; };
@action @action
collapseComments = (documentId: string) => { toggleComments = () => {
this.commentsExpanded = this.commentsExpanded.filter( this.set({ commentsExpanded: !this.commentsExpanded });
(id) => id !== documentId
);
this.persist();
};
@action
expandComments = (documentId: string) => {
if (!this.commentsExpanded.includes(documentId)) {
this.commentsExpanded.push(documentId);
}
this.persist();
};
@action
toggleComments = (documentId: string) => {
if (this.commentsExpanded.includes(documentId)) {
this.collapseComments(documentId);
} else {
this.expandComments(documentId);
}
}; };
@action @action