···

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

     

       
4
       
4
       
 
       
import { Button } from "../components/button";

     

       
5
       
5
       
 
       
import { JSONValue } from "../components/json";

     

       
6
       
6
       
+
       
import { StickyOverlay } from "../components/sticky";

     

       
6
       
7
       
 
       
import { TextInput } from "../components/text-input";

     

       
7
       
8
       
 
       


     

       
8
       
9
       
 
       
const LIMIT = 25;

     
···

       
167
       
168
       
 
       
          Firehose

     

       
168
       
169
       
 
       
        </A>

     

       
169
       
170
       
 
       
      </div>

     

       
170
       
170
       
-
       
      <form

     

       
171
       
171
       
-
       
        ref={formRef}

     

       
172
       
172
       
-
       
        class="dark:bg-dark-500 sticky top-0 z-5 flex w-screen flex-col items-center bg-neutral-100 px-4 text-sm"

     

       
173
       
173
       
-
       
      >

     

       
174
       
174
       
-
       
        <div class="flex w-[22rem] flex-col gap-2 py-3 sm:w-[24rem]">

     

       
171
       
171
       
+
       
      <StickyOverlay>

     

       
172
       
172
       
+
       
        <form ref={formRef} class="flex w-[22rem] flex-col gap-1 text-sm sm:w-[24rem]">

     

       
175
       
173
       
 
       
          <Show when={!connected()}>

     

       
176
       
176
       
-
       
            <label class="flex items-center justify-end gap-x-2">

     

       
174
       
174
       
+
       
            <label class="flex items-center justify-end gap-x-1">

     

       
177
       
175
       
 
       
              <span class="min-w-[5rem]">Instance</span>

     

       
178
       
176
       
 
       
              <TextInput

     

       
179
       
177
       
 
       
                name="instance"

     
···

       
187
       
185
       
 
       
              />

     

       
188
       
186
       
 
       
            </label>

     

       
189
       
187
       
 
       
            <Show when={streamType === StreamType.JETSTREAM}>

     

       
190
       
190
       
-
       
              <label class="flex items-center justify-end gap-x-2">

     

       
188
       
188
       
+
       
              <label class="flex items-center justify-end gap-x-1">

     

       
191
       
189
       
 
       
                <span class="min-w-[5rem]">Collections</span>

     

       
192
       
190
       
 
       
                <textarea

     

       
193
       
191
       
 
       
                  name="collections"

     
···

       
199
       
197
       
 
       
              </label>

     

       
200
       
198
       
 
       
            </Show>

     

       
201
       
199
       
 
       
            <Show when={streamType === StreamType.JETSTREAM}>

     

       
202
       
202
       
-
       
              <label class="flex items-center justify-end gap-x-2">

     

       
200
       
200
       
+
       
              <label class="flex items-center justify-end gap-x-1">

     

       
203
       
201
       
 
       
                <span class="min-w-[5rem]">DIDs</span>

     

       
204
       
202
       
 
       
                <textarea

     

       
205
       
203
       
 
       
                  name="dids"

     
···

       
210
       
208
       
 
       
                />

     

       
211
       
209
       
 
       
              </label>

     

       
212
       
210
       
 
       
            </Show>

     

       
213
       
213
       
-
       
            <label class="flex items-center justify-end gap-x-2">

     

       
211
       
211
       
+
       
            <label class="flex items-center justify-end gap-x-1">

     

       
214
       
212
       
 
       
              <span class="min-w-[5rem]">Cursor</span>

     

       
215
       
213
       
 
       
              <TextInput

     

       
216
       
214
       
 
       
                name="cursor"

     
···

       
253
       
251
       
 
       
              {connected() ? "Disconnect" : "Connect"}

     

       
254
       
252
       
 
       
            </Button>

     

       
255
       
253
       
 
       
          </div>

     

       
256
       
256
       
-
       
        </div>

     

       
257
       
257
       
-
       
      </form>

     

       
254
       
254
       
+
       
        </form>

     

       
255
       
255
       
+
       
      </StickyOverlay>

     

       
258
       
256
       
 
       
      <Show when={notice().length}>

     

       
259
       
257
       
 
       
        <div class="text-red-500 dark:text-red-400">{notice()}</div>

     

       
260
       
258
       
 
       
      </Show>