refactor: better format
This commit is contained in:
@@ -16,7 +16,7 @@ const NotesContextMenu = observer(({ appState }: Props) => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
const closeOnClickOutside = (event: MouseEvent) => {
|
const closeOnClickOutside = (event: MouseEvent) => {
|
||||||
if (!contextMenuRef.current?.contains(event.target as Node)) {
|
if (!contextMenuRef.current?.contains(event.target as Node)) {
|
||||||
appState.notes.setContextMenuOpen(false);
|
appState.notes.setContextMenuOpen(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -75,7 +75,10 @@ export const NotesOptions = observer(
|
|||||||
const { offsetTop, offsetWidth } = tagsButtonRef.current;
|
const { offsetTop, offsetWidth } = tagsButtonRef.current;
|
||||||
setTagsMenuPosition({
|
setTagsMenuPosition({
|
||||||
top: offsetTop,
|
top: offsetTop,
|
||||||
right: ((buttonRect.right + 265) > document.body.clientWidth) ? offsetWidth : -offsetWidth,
|
right:
|
||||||
|
buttonRect.right + 265 > document.body.clientWidth
|
||||||
|
? offsetWidth
|
||||||
|
: -offsetWidth,
|
||||||
});
|
});
|
||||||
setTagsMenuOpen(!tagsMenuOpen);
|
setTagsMenuOpen(!tagsMenuOpen);
|
||||||
}}
|
}}
|
||||||
@@ -92,9 +95,12 @@ export const NotesOptions = observer(
|
|||||||
>
|
>
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<Icon type={IconType.Hashtag} className={iconClass} />
|
<Icon type={IconType.Hashtag} className={iconClass} />
|
||||||
{"Add tag"}
|
{'Add tag'}
|
||||||
</div>
|
</div>
|
||||||
<Icon type={IconType.ChevronRight} className="fill-current color-neutral" />
|
<Icon
|
||||||
|
type={IconType.ChevronRight}
|
||||||
|
className="fill-current color-neutral"
|
||||||
|
/>
|
||||||
</DisclosureButton>
|
</DisclosureButton>
|
||||||
<DisclosurePanel
|
<DisclosurePanel
|
||||||
onKeyUp={(event) => {
|
onKeyUp={(event) => {
|
||||||
@@ -104,19 +110,19 @@ export const NotesOptions = observer(
|
|||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
style={{
|
style={{
|
||||||
...tagsMenuPosition
|
...tagsMenuPosition,
|
||||||
}}
|
}}
|
||||||
className="sn-dropdown sn-dropdown-anchor-right flex flex-col py-2 max-w-265"
|
className="sn-dropdown sn-dropdown-anchor-right flex flex-col py-2 max-w-265"
|
||||||
>
|
>
|
||||||
{appState.tags.tags.map(tag => (
|
{appState.tags.tags.map((tag) => (
|
||||||
<button
|
<button
|
||||||
key={tag.title}
|
key={tag.title}
|
||||||
className={buttonClass}
|
className={buttonClass}
|
||||||
onBlur={closeOnBlur}
|
onBlur={closeOnBlur}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
appState.tags.addTagToSelectedNotes(tag);
|
appState.tags.addTagToSelectedNotes(tag);
|
||||||
}
|
}}
|
||||||
}>
|
>
|
||||||
{tag.title}
|
{tag.title}
|
||||||
</button>
|
</button>
|
||||||
))}
|
))}
|
||||||
@@ -129,7 +135,10 @@ export const NotesOptions = observer(
|
|||||||
appState.notes.setPinSelectedNotes(!pinned);
|
appState.notes.setPinSelectedNotes(!pinned);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Icon type={pinned ? IconType.Unpin : IconType.Pin} className={iconClass} />
|
<Icon
|
||||||
|
type={pinned ? IconType.Unpin : IconType.Pin}
|
||||||
|
className={iconClass}
|
||||||
|
/>
|
||||||
{pinned ? 'Unpin notes' : 'Pin notes'}
|
{pinned ? 'Unpin notes' : 'Pin notes'}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@@ -139,7 +148,10 @@ export const NotesOptions = observer(
|
|||||||
appState.notes.setArchiveSelectedNotes(!archived);
|
appState.notes.setArchiveSelectedNotes(!archived);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Icon type={archived ? IconType.Unarchive : IconType.Archive} className={iconClass} />
|
<Icon
|
||||||
|
type={archived ? IconType.Unarchive : IconType.Archive}
|
||||||
|
className={iconClass}
|
||||||
|
/>
|
||||||
{archived ? 'Unarchive' : 'Archive'}
|
{archived ? 'Unarchive' : 'Archive'}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@@ -148,7 +160,10 @@ export const NotesOptions = observer(
|
|||||||
className={buttonClass}
|
className={buttonClass}
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
setLockCloseOnBlur(true);
|
setLockCloseOnBlur(true);
|
||||||
await appState.notes.setTrashSelectedNotes(!trashed, trashButtonRef);
|
await appState.notes.setTrashSelectedNotes(
|
||||||
|
!trashed,
|
||||||
|
trashButtonRef
|
||||||
|
);
|
||||||
setLockCloseOnBlur(false);
|
setLockCloseOnBlur(false);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -1,13 +1,5 @@
|
|||||||
import {
|
import { ContentType, SNSmartTag, SNTag } from '@standardnotes/snjs';
|
||||||
ContentType,
|
import { action, makeObservable, observable } from 'mobx';
|
||||||
SNSmartTag,
|
|
||||||
SNTag,
|
|
||||||
} from '@standardnotes/snjs';
|
|
||||||
import {
|
|
||||||
action,
|
|
||||||
makeObservable,
|
|
||||||
observable,
|
|
||||||
} from 'mobx';
|
|
||||||
import { WebApplication } from '../application';
|
import { WebApplication } from '../application';
|
||||||
|
|
||||||
export class TagsState {
|
export class TagsState {
|
||||||
@@ -28,20 +20,25 @@ export class TagsState {
|
|||||||
this.application.streamItems(
|
this.application.streamItems(
|
||||||
[ContentType.Tag, ContentType.SmartTag],
|
[ContentType.Tag, ContentType.SmartTag],
|
||||||
async () => {
|
async () => {
|
||||||
this.tags = this.application.getDisplayableItems(ContentType.Tag) as SNTag[];
|
this.tags = this.application.getDisplayableItems(
|
||||||
|
ContentType.Tag
|
||||||
|
) as SNTag[];
|
||||||
this.smartTags = this.application.getSmartTags();
|
this.smartTags = this.application.getSmartTags();
|
||||||
}
|
}
|
||||||
),
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
async addTagToSelectedNotes(tag: SNTag): Promise<void> {
|
async addTagToSelectedNotes(tag: SNTag): Promise<void> {
|
||||||
const selectedNotes = Object.values(this.application.getAppState().notes.selectedNotes);
|
const selectedNotes = Object.values(
|
||||||
|
this.application.getAppState().notes.selectedNotes
|
||||||
|
);
|
||||||
await Promise.all(
|
await Promise.all(
|
||||||
selectedNotes.map(async note =>
|
selectedNotes.map(
|
||||||
await this.application.changeItem(tag.uuid, (mutator) => {
|
async (note) =>
|
||||||
mutator.addItemAsRelationship(note);
|
await this.application.changeItem(tag.uuid, (mutator) => {
|
||||||
})
|
mutator.addItemAsRelationship(note);
|
||||||
|
})
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
this.application.sync();
|
this.application.sync();
|
||||||
|
|||||||
Reference in New Issue
Block a user