fix: tab pointer event none, unselect on blur tab and github action

Author: vincehi

.github/workflows/main.yml

@@ -48,14 +48,19 @@ jobs:
         run: |
           sed -i 's/"version": "[0-9]\+\.[0-9]\+\.[0-9]\+"/"version": "${{ needs.get-next-release.outputs.next-release-version }}"/' src-tauri/tauri.conf.json
       - name: Prepare commit changes
+        id: current-commit
         run: |
           git config user.name "github-actions"
           git config user.email "github-actions@github.com"
           git add src-tauri/tauri.conf.json
           git commit -m "Bump version [skip ci]"
+          git push --dry-run
           echo "last-commit-sha=$(git rev-parse HEAD)" >> "$GITHUB_OUTPUT"
+      - name: Show last commit SHA
+        run: |
+          echo "Last commit SHA: ${{ steps.current-commit.outputs.last-commit-sha }}"
     outputs:
-      last-commit-sha: ${{ steps.prepare-commit.outputs.last-commit-sha }}
+      last-commit-sha: ${{ steps.current-commit.outputs.last-commit-sha }}
 
   build:
     needs:

src-tauri/tauri.conf.json

@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "pulp",
-    "version": "1.3.1"
+    "version": "1.3.2"
   },
   "tauri": {
     "allowlist": {

src/components/Tabs/Tabs.tsx

@@ -22,36 +22,39 @@ const Tabs: FlowComponent<Props, Component<any>> = (props) => {
             const [getRenamingMode, setRenamingMode] = createSignal(false);
 
             return (
-              <div class="tab flex-shrink-0 flex items-center" classList={{ "tab-active": item.active }}>
-                <label class="input-sizer" data-value={item.name}>
+              <a
+                ondblclick={(event) => {
+                  event.stopPropagation();
+                  setRenamingMode(true);
+                  setFocused(true);
+                  target()?.select();
+                }}
+                onClick={() => props.setActive(index())}
+                class="tab flex-shrink-0"
+                classList={{
+                  "tab-active": item.active
+                }}
+              >
+                <label classList={{
+                  "cursor-pointer": !getRenamingMode()
+                }} class="input-sizer" data-value={item.name}>
                   <input
+                    classList={{
+                      "pointer-events-none": !getRenamingMode(),
+                    }}
                     ref={setTarget}
                     type="text"
                     value={item.name}
-                    readOnly={!getRenamingMode()}
-                    class="appearance-none bg-transparent border-none focus:outline-none cursor-pointer"
-                    classList={{
-                      "cursor-text": getRenamingMode(),
-                    }}
-                    onClick={(event) => {
-                      if (!getRenamingMode()) {
-                        props.setActive(index());
-                      }
-                    }}
-                    onDblClick={(event) => {
-                      event.preventDefault();
-                      setRenamingMode(true);
-                      setFocused(true);
-                      target()?.select();
-                    }}
-                    onBlur={() => setRenamingMode(false)}
+                    disabled={!getRenamingMode()}
+                    onBlur={(event) => {
+                      window.getSelection()?.removeAllRanges(); // TODO: unselectinput
+                      setRenamingMode(false)}}
                     onInput={(event) => {
                       tabsStore.rename(index(), event.target.value);
                     }}
                     onKeyDown={(event) => {
                       if (event.key === "Enter") {
                         event.preventDefault();
-                        setRenamingMode(false);
                         setFocused(false);
                       }
                     }}
@@ -68,7 +71,7 @@ const Tabs: FlowComponent<Props, Component<any>> = (props) => {
                 >
                   <Icon path={xMark} class="flex-shrink-0 w-4" />
                 </button>
-              </div>
+              </a>
             );
           }}
         </For>