Prevent highlight and selection cursor hover on UI text items (#541)

* Add `select-none` and `cursor-default` to root to prevent selection and
hover on most items

* Lint

* refactor paths a bit

* format

---------

Co-authored-by: CJ Pais <cj@cjpais.com>

.github/PULL_REQUEST_TEMPLATE.md

@@ -60,5 +60,6 @@ It is not explicitly required to gather feedback, but it certainly helps your PR
 - [ ] AI was used (please describe below)
 
 **If AI was used:**
+
 - Tools used:
 - How extensively:

CONTRIBUTING.md

@@ -227,6 +227,7 @@ Community feedback is essential to keeping Handy the best it can be for everyone
 **AI-assisted PRs are welcome!** Use whatever tools help you contribute, just be upfront about it.
 
 In your PR description, please include:
+
 - Whether AI was used (yes/no)
 - Which tools were used (e.g., "Claude Code", "GitHub Copilot", "ChatGPT")
 - How extensively it was used (e.g., "generated boilerplate", "helped debug", "wrote most of the code")

src/App.tsx

@@ -74,7 +74,7 @@ function App() {
   }
 
   return (
-    <div className="h-screen flex flex-col">
+    <div className="h-screen flex flex-col select-none cursor-default">
       <Toaster />
       {/* Main content area that takes remaining space */}
       <div className="flex-1 flex overflow-hidden">

src/components/settings/AppDataDirectory.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { commands } from "@/bindings";
 import { SettingContainer } from "../ui/SettingContainer";
-import { Button } from "../ui/Button";
+import { PathDisplay } from "../ui/PathDisplay";
 
 interface AppDataDirectoryProps {
   descriptionMode?: "tooltip" | "inline";
@@ -75,20 +75,11 @@ export const AppDataDirectory: React.FC<AppDataDirectoryProps> = ({
       grouped={grouped}
       layout="stacked"
     >
-      <div className="flex items-center gap-2">
-        <div className="flex-1 min-w-0 px-2 py-2 bg-mid-gray/10 border border-mid-gray/80 rounded text-xs font-mono break-all">
-          {appDirPath}
-        </div>
-        <Button
-          onClick={handleOpen}
-          variant="secondary"
-          size="sm"
-          disabled={!appDirPath}
-          className="px-3 py-2"
-        >
-          {t("common.open")}
-        </Button>
-      </div>
+      <PathDisplay
+        path={appDirPath}
+        onOpen={handleOpen}
+        disabled={!appDirPath}
+      />
     </SettingContainer>
   );
 };

src/components/settings/debug/DebugPaths.tsx

@@ -26,21 +26,23 @@ export const DebugPaths: React.FC<DebugPathsProps> = ({
             {t("settings.debug.paths.appData")}
           </span>{" "}
           {/* eslint-disable-next-line i18next/no-literal-string */}
-          <span className="font-mono text-xs">%APPDATA%/handy</span>
+          <span className="font-mono text-xs select-text">%APPDATA%/handy</span>
         </div>
         <div>
           <span className="font-medium">
             {t("settings.debug.paths.models")}
           </span>{" "}
           {/* eslint-disable-next-line i18next/no-literal-string */}
-          <span className="font-mono text-xs">%APPDATA%/handy/models</span>
+          <span className="font-mono text-xs select-text">
+            %APPDATA%/handy/models
+          </span>
         </div>
         <div>
           <span className="font-medium">
             {t("settings.debug.paths.settings")}
           </span>{" "}
           {/* eslint-disable-next-line i18next/no-literal-string */}
-          <span className="font-mono text-xs">
+          <span className="font-mono text-xs select-text">
             %APPDATA%/handy/settings_store.json
           </span>
         </div>

src/components/settings/debug/LogDirectory.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { commands } from "@/bindings";
 import { SettingContainer } from "../../ui/SettingContainer";
-import { Button } from "../../ui/Button";
+import { PathDisplay } from "../../ui/PathDisplay";
 
 interface LogDirectoryProps {
   descriptionMode?: "tooltip" | "inline";
@@ -67,20 +67,7 @@ export const LogDirectory: React.FC<LogDirectoryProps> = ({
           {t("errors.loadDirectory", { error })}
         </div>
       ) : (
-        <div className="flex items-center gap-2">
-          <div className="flex-1 min-w-0 px-2 py-2 bg-mid-gray/10 border border-mid-gray/80 rounded text-xs font-mono break-all">
-            {logDir}
-          </div>
-          <Button
-            onClick={handleOpen}
-            variant="secondary"
-            size="sm"
-            disabled={!logDir}
-            className="px-3 py-2"
-          >
-            {t("common.open")}
-          </Button>
-        </div>
+        <PathDisplay path={logDir} onOpen={handleOpen} disabled={!logDir} />
       )}
     </SettingContainer>
   );

src/components/settings/history/HistorySettings.tsx

@@ -290,7 +290,7 @@ const HistoryEntryComponent: React.FC<HistoryEntryProps> = ({
           </button>
         </div>
       </div>
-      <p className="italic text-text/90 text-sm pb-2">
+      <p className="italic text-text/90 text-sm pb-2 select-text cursor-text">
         {entry.transcription_text}
       </p>
       {audioUrl && <AudioPlayer src={audioUrl} className="w-full" />}

src/components/ui/PathDisplay.tsx

@@ -0,0 +1,34 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Button } from "./Button";
+
+interface PathDisplayProps {
+  path: string;
+  onOpen: () => void;
+  disabled?: boolean;
+}
+
+export const PathDisplay: React.FC<PathDisplayProps> = ({
+  path,
+  onOpen,
+  disabled = false,
+}) => {
+  const { t } = useTranslation();
+
+  return (
+    <div className="flex items-center gap-2">
+      <div className="flex-1 min-w-0 px-2 py-2 bg-mid-gray/10 border border-mid-gray/80 rounded text-xs font-mono break-all select-text cursor-text">
+        {path}
+      </div>
+      <Button
+        onClick={onOpen}
+        variant="secondary"
+        size="sm"
+        disabled={disabled}
+        className="px-3 py-2"
+      >
+        {t("common.open")}
+      </Button>
+    </div>
+  );
+};