refactor: better format

This commit is contained in:
Antonella Sgarlatta
2021-05-05 11:31:04 -03:00
parent bffe63cc3c
commit e5750e88c6
3 changed files with 41 additions and 29 deletions

View File

@@ -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);
} }
}; };

View File

@@ -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);
}} }}
> >

View File

@@ -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();