Merge remote-tracking branch 'upstream/develop' into account-menu-react

app/assets/javascripts/components/AutocompleteTagInput.tsx

@@ -47,7 +47,9 @@ export const AutocompleteTagInput = observer(({ appState }: Props) => {
 
   const onFormSubmit = async (event: Event) => {
     event.preventDefault();
-    await appState.noteTags.createAndAddNewTag();
+    if (autocompleteSearchQuery !== '') {
+      await appState.noteTags.createAndAddNewTag();
+    }
   };
 
   const onKeyDown = (event: KeyboardEvent) => {
@@ -115,8 +117,9 @@ export const AutocompleteTagInput = observer(({ appState }: Props) => {
             ref={dropdownRef}
             className={`${tags.length > 0 ? 'w-80' : 'w-70 mr-10'} sn-dropdown flex flex-col py-2 absolute`}
             style={{ maxHeight: dropdownMaxHeight, maxWidth: tagsContainerMaxWidth }}
+            onBlur={closeOnBlur}
           >
-            <div className="overflow-y-scroll">
+            <div className="overflow-y-auto">
               {autocompleteTagResults.map((tagResult) => (
                 <AutocompleteTagResult
                   key={tagResult.uuid}

app/assets/javascripts/components/NotesContextMenu.tsx

@@ -23,7 +23,7 @@ const NotesContextMenu = observer(({ appState }: Props) => {
   return appState.notes.contextMenuOpen ? (
     <div
       ref={contextMenuRef}
-      className="sn-dropdown max-h-120 max-w-xs flex flex-col py-2 overflow-y-scroll fixed"
+      className="sn-dropdown min-w-80 max-h-120 max-w-xs flex flex-col py-2 overflow-y-auto fixed"
       style={{
         ...appState.notes.contextMenuPosition,
         maxHeight: appState.notes.contextMenuMaxHeight,

app/assets/javascripts/components/NotesOptions.tsx

@@ -159,7 +159,7 @@ export const NotesOptions = observer(
                 maxHeight: tagsMenuMaxHeight,
                 position: 'fixed',
               }}
-              className="sn-dropdown flex flex-col py-2 max-h-120 max-w-xs fixed overflow-y-scroll"
+              className="sn-dropdown min-w-80 flex flex-col py-2 max-h-120 max-w-xs fixed overflow-y-auto"
             >
               {appState.tags.tags.map((tag) => (
                 <button

app/assets/javascripts/components/NotesOptionsPanel.tsx

@@ -71,7 +71,7 @@ export const NotesOptionsPanel = observer(({ appState }: Props) => {
           ...position,
           maxHeight,
         }}
-        className="sn-dropdown sn-dropdown--animated max-h-120 max-w-xs flex flex-col py-2 overflow-y-scroll fixed"
+        className="sn-dropdown sn-dropdown--animated min-w-80 max-h-120 max-w-xs flex flex-col py-2 overflow-y-auto fixed"
       >
         {open && (
           <NotesOptions

app/assets/javascripts/components/SearchOptions.tsx

@@ -63,7 +63,7 @@ const SearchOptions = observer(({ appState }: Props) => {
         style={{
           top: optionsPanelTop,
         }}
-        className="sn-dropdown sn-dropdown--anchor-right sn-dropdown--animated absolute grid gap-2 py-2"
+        className="sn-dropdown sn-dropdown--anchor-right sn-dropdown--animated min-w-80 absolute grid gap-2 py-2"
       >
         <Switch
           className="h-10"

app/assets/javascripts/components/SessionsModal.tsx

@@ -126,7 +126,7 @@ const SessionsModal: FunctionComponent<{
 
   return (
     <>
-      <Dialog onDismiss={close} className="sessions-modal h-screen py-8">
+      <Dialog onDismiss={close} className="sessions-modal h-90vh">
         <div className="sk-modal-content">
           <div class="sn-component">
             <div class="sk-panel">
@@ -145,7 +145,7 @@ const SessionsModal: FunctionComponent<{
                   </button>
                 </div>
               </div>
-              <div class="sk-panel-content overflow-y-scroll">
+              <div class="sk-panel-content overflow-y-auto">
                 {refreshing ? (
                   <>
                     <div class="sk-spinner small info"></div>

app/assets/javascripts/views/tags/tags_view.ts

@@ -267,6 +267,7 @@ class TagsViewCtrl extends PureViewCtrl<unknown, TagState> {
 
   async clickedAddNewTag() {
     if (this.getState().editingTag) {
+      console.log('editing');
       return;
     }
     const newTag = await this.application.createTemplateItem(
@@ -289,10 +290,10 @@ class TagsViewCtrl extends PureViewCtrl<unknown, TagState> {
 
   async saveTag($event: Event, tag: SNTag) {
     ($event.target! as HTMLInputElement).blur();
-    if (!this.titles[tag.uuid]?.length) {
-      return this.undoCreateTag(tag);
-    }
     if (this.getState().templateTag) {
+      if (!this.titles[tag.uuid]?.length) {
+        return this.undoCreateTag(tag);
+      }
       return this.saveNewTag();
     } else {
       return this.saveTagRename(tag);
@@ -314,6 +315,9 @@ class TagsViewCtrl extends PureViewCtrl<unknown, TagState> {
     if (newTitle.length === 0) {
       this.titles[tag.uuid] = this.editingOriginalName;
       this.editingOriginalName = undefined;
+      await this.setState({
+        editingTag: undefined
+      });
       return;
     }
     const existingTag = this.application.findTagByTitle(newTitle);
@@ -345,6 +349,7 @@ class TagsViewCtrl extends PureViewCtrl<unknown, TagState> {
       this.application.alertService!.alert(
         "A tag with this name already exists."
       );
+      this.undoCreateTag(newTag);
       return;
     }
     const insertedTag = await this.application.insertItem(newTag);

app/assets/stylesheets/_sn.scss

@@ -259,8 +259,8 @@
   height: 4.5rem;
 }
 
-.h-screen {
-  height: 100vh;
+.h-90vh {
+  height: 90vh;
 }
 
 .max-h-120 {
@@ -275,8 +275,8 @@
   position: fixed;
 }
 
-.overflow-y-scroll {
-  overflow-y: scroll;
+.overflow-y-auto {
+  overflow-y: auto;
 }
 
 .overflow-auto {
@@ -360,7 +360,6 @@
 
 .sn-dropdown {
   @extend .bg-default;
-  // @extend .min-w-80;
   @extend .rounded;
   @extend .box-shadow;