commit a183346ef6fee0b67efd63aa601eccbb8a734824 · pdsls.dev/pdsls

+81 -72
src/components/backlinks.tsx
···

       11
       11
        
       import { Button } from "./button.jsx";

     

       12
       12
        
       

     

       13
       13
        
       type Backlink = {

     

       14
       14
       -
         collection: string;

     

       15
       14
        
         path: string;

     

       16
       15
        
         counts: { distinct_dids: number; records: number };

     

       17
       16
        
       };

     

       18
       17
        
       

     

       19
       18
        
       const linksBySource = (links: Record<string, any>) => {

     

       20
       20
       -
         let out: Backlink[] = [];

     

       19
       19
       +
         let out: Record<string, Backlink[]> = {};

     

       21
       20
        
         Object.keys(links)

     

       22
       21
        
           .toSorted()

     

       23
       22
        
           .forEach((collection) => {

     
···

       26
       25
        
               .toSorted()

     

       27
       26
        
               .forEach((path) => {

     

       28
       27
        
                 if (paths[path].records === 0) return;

     

       29
       29
       -
                 out.push({ collection, path, counts: paths[path] });

     

       28
       28
       +
                 if (out[collection]) out[collection].push({ path, counts: paths[path] });

     

       29
       29
       +
                 else out[collection] = [{ path, counts: paths[path] }];

     

       30
       30
        
               });

     

       31
       31
        
           });

     

       32
       32
        
         return out;

     
···

       48
       48
        
       

     

       49
       49
        
         return (

     

       50
       50
        
           <div class="flex w-full flex-col gap-1 text-sm wrap-anywhere">

     

       51
       51
       -
             <Show when={response()?.length === 0}>

     

       52
       52
       -
               <p>No backlinks found.</p>

     

       53
       53
       -
             </Show>

     

       54
       54
       -
             <For each={response()}>

     

       55
       55
       -
               {({ collection, path, counts }) => (

     

       56
       56
       -
                 <div>

     

       51
       51
       +
             <Show

     

       52
       52
       +
               when={response() && Object.keys(response()!).length}

     

       53
       53
       +
               fallback={<p>No backlinks found.</p>}

     

       54
       54
       +
             >

     

       55
       55
       +
               <For each={Object.keys(response()!)}>

     

       56
       56
       +
                 {(collection) => (

     

       57
       57
        
                   <div>

     

       58
       58
        
                     <div class="flex items-center gap-1">

     

       59
       59
        
                       <span

     
···

       62
       62
        
                       ></span>

     

       63
       63
        
                       {collection}

     

       64
       64
        
                     </div>

     

       65
       65
       -
                     <div class="flex items-center gap-1">

     

       66
       66
       -
                       <span

     

       67
       67
       -
                         title="Record path where the link is found"

     

       68
       68
       -
                         class="iconify lucide--route shrink-0"

     

       69
       69
       -
                       ></span>

     

       70
       70
       -
                       {path.slice(1)}

     

       71
       71
       -
                     </div>

     

       72
       72
       -
                   </div>

     

       73
       73
       -
                   <div class="ml-4.5">

     

       74
       74
       -
                     <p>

     

       75
       75
       -
                       <button

     

       76
       76
       -
                         class="text-blue-400 hover:underline active:underline"

     

       77
       77
       -
                         title="Show linking records"

     

       78
       78
       -
                         onclick={() =>

     

       79
       79
       -
                           (

     

       80
       80
       -
                             show()?.collection === collection &&

     

       81
       81
       -
                             show()?.path === path &&

     

       82
       82
       -
                             !show()?.showDids

     

       83
       83
       -
                           ) ?

     

       84
       84
       -
                             setShow(null)

     

       85
       85
       -
                           : setShow({ collection, path, showDids: false })

     

       86
       86
       -
                         }

     

       87
       87
       -
                       >

     

       88
       88
       -
                         {counts.records} record{counts.records < 2 ? "" : "s"}

     

       89
       89
       -
                       </button>

     

       90
       90
       -
                       {" from "}

     

       91
       91
       -
                       <button

     

       92
       92
       -
                         class="text-blue-400 hover:underline active:underline"

     

       93
       93
       -
                         title="Show linking DIDs"

     

       94
       94
       -
                         onclick={() =>

     

       95
       95
       -
                           show()?.collection === collection && show()?.path === path && show()?.showDids ?

     

       96
       96
       -
                             setShow(null)

     

       97
       97
       -
                           : setShow({ collection, path, showDids: true })

     

       98
       98
       -
                         }

     

       99
       99
       -
                       >

     

       100
       100
       -
                         {counts.distinct_dids} DID

     

       101
       101
       -
                         {counts.distinct_dids < 2 ? "" : "s"}

     

       102
       102
       -
                       </button>

     

       103
       103
       -
                     </p>

     

       104
       104
       -
                     <Show when={show()?.collection === collection && show()?.path === path}>

     

       105
       105
       -
                       <Show when={show()?.showDids}>

     

       106
       106
       -
                         {/* putting this in the `dids` prop directly failed to re-render. idk how to solidjs. */}

     

       107
       107
       -
                         <p class="w-full font-semibold">Distinct identities</p>

     

       108
       108
       -
                         <BacklinkItems

     

       109
       109
       -
                           target={props.target}

     

       110
       110
       -
                           collection={collection}

     

       111
       111
       -
                           path={path}

     

       112
       112
       -
                           dids={true}

     

       113
       113
       -
                         />

     

       114
       114
       -
                       </Show>

     

       115
       115
       -
                       <Show when={!show()?.showDids}>

     

       116
       116
       -
                         <p class="w-full font-semibold">Records</p>

     

       117
       117
       -
                         <BacklinkItems

     

       118
       118
       -
                           target={props.target}

     

       119
       119
       -
                           collection={collection}

     

       120
       120
       -
                           path={path}

     

       121
       121
       -
                           dids={false}

     

       122
       122
       -
                         />

     

       123
       123
       -
                       </Show>

     

       124
       124
       -
                     </Show>

     

       65
       65
       +
                     <For each={response()![collection]}>

     

       66
       66
       +
                       {({ path, counts }) => (

     

       67
       67
       +
                         <div class="ml-4.5">

     

       68
       68
       +
                           <div class="flex items-center gap-1">

     

       69
       69
       +
                             <span

     

       70
       70
       +
                               title="Record path where the link is found"

     

       71
       71
       +
                               class="iconify lucide--route shrink-0"

     

       72
       72
       +
                             ></span>

     

       73
       73
       +
                             {path.slice(1)}

     

       74
       74
       +
                           </div>

     

       75
       75
       +
                           <div class="ml-4.5">

     

       76
       76
       +
                             <p>

     

       77
       77
       +
                               <button

     

       78
       78
       +
                                 class="text-blue-400 hover:underline active:underline"

     

       79
       79
       +
                                 title="Show linking records"

     

       80
       80
       +
                                 onclick={() =>

     

       81
       81
       +
                                   (

     

       82
       82
       +
                                     show()?.collection === collection &&

     

       83
       83
       +
                                     show()?.path === path &&

     

       84
       84
       +
                                     !show()?.showDids

     

       85
       85
       +
                                   ) ?

     

       86
       86
       +
                                     setShow(null)

     

       87
       87
       +
                                   : setShow({ collection, path, showDids: false })

     

       88
       88
       +
                                 }

     

       89
       89
       +
                               >

     

       90
       90
       +
                                 {counts.records} record{counts.records < 2 ? "" : "s"}

     

       91
       91
       +
                               </button>

     

       92
       92
       +
                               {" from "}

     

       93
       93
       +
                               <button

     

       94
       94
       +
                                 class="text-blue-400 hover:underline active:underline"

     

       95
       95
       +
                                 title="Show linking DIDs"

     

       96
       96
       +
                                 onclick={() =>

     

       97
       97
       +
                                   (

     

       98
       98
       +
                                     show()?.collection === collection &&

     

       99
       99
       +
                                     show()?.path === path &&

     

       100
       100
       +
                                     show()?.showDids

     

       101
       101
       +
                                   ) ?

     

       102
       102
       +
                                     setShow(null)

     

       103
       103
       +
                                   : setShow({ collection, path, showDids: true })

     

       104
       104
       +
                                 }

     

       105
       105
       +
                               >

     

       106
       106
       +
                                 {counts.distinct_dids} DID

     

       107
       107
       +
                                 {counts.distinct_dids < 2 ? "" : "s"}

     

       108
       108
       +
                               </button>

     

       109
       109
       +
                             </p>

     

       110
       110
       +
                             <Show when={show()?.collection === collection && show()?.path === path}>

     

       111
       111
       +
                               <Show when={show()?.showDids}>

     

       112
       112
       +
                                 <p class="w-full font-semibold">Distinct identities</p>

     

       113
       113
       +
                                 <BacklinkItems

     

       114
       114
       +
                                   target={props.target}

     

       115
       115
       +
                                   collection={collection}

     

       116
       116
       +
                                   path={path}

     

       117
       117
       +
                                   dids={true}

     

       118
       118
       +
                                 />

     

       119
       119
       +
                               </Show>

     

       120
       120
       +
                               <Show when={!show()?.showDids}>

     

       121
       121
       +
                                 <p class="w-full font-semibold">Records</p>

     

       122
       122
       +
                                 <BacklinkItems

     

       123
       123
       +
                                   target={props.target}

     

       124
       124
       +
                                   collection={collection}

     

       125
       125
       +
                                   path={path}

     

       126
       126
       +
                                   dids={false}

     

       127
       127
       +
                                 />

     

       128
       128
       +
                               </Show>

     

       129
       129
       +
                             </Show>

     

       130
       130
       +
                           </div>

     

       131
       131
       +
                         </div>

     

       132
       132
       +
                       )}

     

       133
       133
       +
                     </For>

     

       125
       134
        
                   </div>

     

       126
       126
       -
                 </div>

     

       127
       127
       -
               )}

     

       128
       128
       -
             </For>

     

       135
       135
       +
                 )}

     

       136
       136
       +
               </For>

     

       137
       137
       +
             </Show>

     

       129
       138
        
           </div>

     

       130
       139
        
         );

     

       131
       140
        
       };