commit fe4c5de3030d3b6efb307f0d8a66927f60702f5c · pdsls.dev/pdsls

+25 -5

src/components/search.tsx

···

       1
       1
        
       import { Client, simpleFetchHandler } from "@atcute/client";

     

       2
       2
        
       import { Nsid } from "@atcute/lexicons";

     

       3
       3
       -
       import { A, useLocation, useNavigate } from "@solidjs/router";

     

       4
       4
       -
       import { createResource, createSignal, For, onCleanup, onMount, Show } from "solid-js";

     

       3
       3
       +
       import { A, useNavigate } from "@solidjs/router";

     

       4
       4
       +
       import {

     

       5
       5
       +
         createEffect,

     

       6
       6
       +
         createResource,

     

       7
       7
       +
         createSignal,

     

       8
       8
       +
         For,

     

       9
       9
       +
         onCleanup,

     

       10
       10
       +
         onMount,

     

       11
       11
       +
         Show,

     

       12
       12
       +
       } from "solid-js";

     

       5
       13
        
       import { isTouchDevice } from "../layout";

     

       6
       14
        
       import { resolveLexiconAuthority } from "../utils/api";

     

       7
       15
        
       import { appHandleLink, appList, appName, AppUrl } from "../utils/app-urls";

     
···

       38
       46
        
       

     

       39
       47
        
           if ((ev.ctrlKey || ev.metaKey) && ev.key == "k") {

     

       40
       48
        
             ev.preventDefault();

     

       41
       41
       -
             setShowSearch(!showSearch());

     

       49
       49
       +
       

     

       50
       50
       +
             if (showSearch()) {

     

       51
       51
       +
               const searchInput = document.querySelector("#input") as HTMLInputElement;

     

       52
       52
       +
               if (searchInput && document.activeElement !== searchInput) {

     

       53
       53
       +
                 searchInput.focus();

     

       54
       54
       +
               } else {

     

       55
       55
       +
                 setShowSearch(false);

     

       56
       56
       +
               }

     

       57
       57
       +
             } else {

     

       58
       58
       +
               setShowSearch(true);

     

       59
       59
       +
             }

     

       42
       60
        
           } else if (ev.key == "Escape") {

     

       43
       61
        
             ev.preventDefault();

     

       44
       62
        
             setShowSearch(false);

     
···

       71
       89
        
         });

     

       72
       90
        
       

     

       73
       91
        
         onMount(() => {

     

       74
       74
       -
           if (useLocation().pathname !== "/") searchInput.focus();

     

       75
       75
       -
       

     

       76
       92
        
           const handlePaste = (e: ClipboardEvent) => {

     

       77
       93
        
             if (e.target === searchInput) return;

     

       78
       94
        
             if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) return;

     
···

       83
       99
        
       

     

       84
       100
        
           window.addEventListener("paste", handlePaste);

     

       85
       101
        
           onCleanup(() => window.removeEventListener("paste", handlePaste));

     

       102
       102
       +
         });

     

       103
       103
       +
       

     

       104
       104
       +
         createEffect(() => {

     

       105
       105
       +
           if (showSearch()) searchInput.focus();

     

       86
       106
        
         });

     

       87
       107
        
       

     

       88
       108
        
         const fetchTypeahead = async (input: string) => {

+1 -3

src/layout.tsx

···

       128
       128
        
                 <span>PDSls</span>

     

       129
       129
        
               </A>

     

       130
       130
        
               <div class="dark:bg-dark-300/60 relative flex items-center gap-0.5 rounded-lg bg-neutral-50/60 px-1 py-0.5">

     

       131
       131
       -
                 <Show when={location.pathname !== "/"}>

     

       132
       132
       -
                   <SearchButton />

     

       133
       133
       -
                 </Show>

     

       131
       131
       +
                 <SearchButton />

     

       134
       132
        
                 <Show when={hasUserScope("create")}>

     

       135
       133
        
                   <RecordEditor create={true} />

     

       136
       134
        
                 </Show>