cement4357 Posts - Answer Overflow

cement4357

•Created by cement4357 on 7/8/2023 in #questions

UploadDropzone - dragging items from the same page

Salut fellas, Recently I go into UploadDropzone component and I wanted to test it out, however, in my scenario it doesn't really work everywhere. What I am trying to achieve: - Load image dynamically from provided url to image component ✅ - Perform some actions on the image, return blob and update image source ✅ - Drag and drop processed image to UploadDropzone component ❌ (it works on Safari, but not on other browsers - funny thing) Here are my code snippets: Image component

<img
  id="image-preview"
  src={imageWatcher}
  width={230}
  height={230}
  className="p-3 px-5 py-2.5 mr-2 mb-2"
  alt={imageWatcher}
  draggable
/>

<img
  id="image-preview"
  src={imageWatcher}
  width={230}
  height={230}
  className="p-3 px-5 py-2.5 mr-2 mb-2"
  alt={imageWatcher}
  draggable
/>

UploadDropzone component

<UploadDropzone
  endpoint="imageUploader"
  onClientUploadComplete={(res) => {
    SuccessToast('Image uploaded sucessfully');
    setValue('image', res.fileUrl);
  }}
  onUploadError={(error: Error) => {
    ErrorToast(`${error.message}`);
  }}
/>

<UploadDropzone
  endpoint="imageUploader"
  onClientUploadComplete={(res) => {
    SuccessToast('Image uploaded sucessfully');
    setValue('image', res.fileUrl);
  }}
  onUploadError={(error: Error) => {
    ErrorToast(`${error.message}`);
  }}
/>

I tried to debug DragEvents, but the thing is that everytime I am grabbing image, it doesn't appear to load to dataTransfer items/files property. Any ideas?

1 replies

TTCTheo's Typesafe Cult

•Created by cement4357 on 2/24/2023 in #questions

Prefetching more items than requested on client side

Hey guys, I was wondering about prefetching a long list of items (100) with getServerSideProps, but then - user will request just 10 of them on every page. Is that actually going to work and take 10 items of prefetched 100 every time? Or prefetch query has to be exactly the same as user query? I.e. if 100 items got prefetched then user also has to fetch 100 in order to make use of prefetch feature?

15 replies

TTCTheo's Typesafe Cult

•Created by cement4357 on 2/5/2023 in #questions

Using outer and inner context together [trpc]

Hi guys, I am experiencing troubles during implementing both - inner and outer context in one appRouter. Let me show you an example below: I want to use two contexts alternately, when I'm calling some stuff on client-side I want to use outer context, but I also want to use getServerSideProps to send some other queries, that are context unrelated - here I want to use inner context. Is there a way to combine both contexts on createNextApiHandler (appRouter), or I need to create two 'apis' - one for inner context and the other one for outer context?

1 replies

Gaming

Programming