npm - @xuda.io/xuda-widget-plugin-xuda-drive - Versions diffs - 1.0.2 → 1.0.4 - Mend

@xuda.io/xuda-widget-plugin-xuda-drive 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/index.mjs CHANGED Viewed

@@ -74,8 +74,9 @@ export const methods = {
       },
       file_tags: {
         label: "File Tags",
-        type: "string",
+        type: "array",
         tooltip: "Separate with commas",
+        render: "chips",
       },
       auto_tag_generator: {
         label: "Auto Tag Generator",
@@ -141,8 +142,8 @@ export const methods = {
     name: "Viewer",
     tooltip: "",
     fields: {
-      file_upload_mime_type_preset: {
-        label: "Mime Type",
+      default_view_type: {
+        label: "Default View Type",
         type: "string",
         render: "select",
         tooltip: "",
@@ -152,16 +153,16 @@ export const methods = {
             value: "",
           },
           {
-            label: "Video",
-            value: "video",
+            label: "Thumbnails",
+            value: "thumbnails",
           },
           {
-            label: "Audio",
-            value: "audio",
+            label: "List",
+            value: "list",
           },
           {
-            label: "Image",
-            value: "image",
+            label: "Slider",
+            value: "slider",
           },
         ],
       },
@@ -175,6 +176,38 @@ export const methods = {
         type: "string",
         tooltip: "Separate with commas",
       },
+      sort_by: {
+        label: "Sort By",
+        type: "string",
+        render: "select",
+        tooltip: "",
+        options: [
+          {
+            label: "File Name",
+            value: "",
+          },
+          {
+            label: "Date Modified",
+            value: "date",
+          },
+        ],
+      },
+      sort_order: {
+        label: "Sort Order",
+        type: "string",
+        render: "segment",
+        tooltip: "",
+        options: [
+          {
+            label: "Ascending",
+            value: "",
+          },
+          {
+            label: "Descending",
+            value: "descending",
+          },
+        ],
+      },
     },
     response: { uploaded_files: "" },
   },

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@xuda.io/xuda-widget-plugin-xuda-drive",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Xuda Drive widget plugin",
   "scripts": {
     "pub": "npm version patch --force && npm publish  --access public"

package/runtime.mjs CHANGED Viewed

@@ -536,7 +536,7 @@ export async function viewer(fields, e) {
     <!-- Gallery -->
     <section class="mt-8 pb-16" aria-labelledby="gallery-heading">
       <h2 id="gallery-heading" class="sr-only">Recently viewed</h2>
-      <ul role="list" class="grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-6 md:grid-cols-4 lg:grid-cols-3 xl:grid-cols-4 xl:gap-x-8">
+      <ul role="list" class="grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-6 md:grid-cols-4 lg:grid-cols-3 xl:grid-cols-4 xl:gap-x-8 [&>li>div>img]:aspect-[3/2]">
         <li class="relative">
           <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 ring-2 ring-indigo-500 ring-offset-2" x-state:on="Current" x-state:off="Default" x-state-description='Current: "ring-2 ring-indigo-500 ring-offset-2", Default: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
             <img src="https://images.unsplash.com/photo-1582053433976-25c00369fc93?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover" x-state:on="Current" x-state:off="Default" x-state-description='Current: "", Default: "group-hover:opacity-75"' />
@@ -547,236 +547,7 @@ export async function viewer(fields, e) {
           <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_4985.HEIC</p>
           <p class="pointer-events-none block text-sm font-medium text-gray-500">3.9 MB</p>
         </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1614926857083-7be149266cda?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_5214.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_5214.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1614705827065-62c3dc488f40?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_3851.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_3851.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.8 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1441974231531-c6227db76b6e?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_4278.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_4278.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4.1 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1586348943529-beaae6c28db9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_6842.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_6842.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1497436072909-60f360e1d4b1?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_3284.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_3284.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.9 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1547036967-23d11aacaee0?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_4841.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_4841.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.8 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1492724724894-7464c27d0ceb?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_5644.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_5644.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1513682322455-ea8b2d81d418?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_4945.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_4945.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1463107971871-fbac9ddb920f?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_2156.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_2156.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4.1 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1552461871-ce4f9fb3b438?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_6945.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_6945.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4.2 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1446292532430-3e76f6ab6444?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_1846.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_1846.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.6 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1508669232496-137b159c1cdb?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_4769.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_4769.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.3 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1431512284068-4c4002298068?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_9513.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_9513.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1581320546160-0078de357255?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_8451.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_8451.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1541956628-68d338ae09d5?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_1298.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_1298.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4.1 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1505429155379-441cc7a574f7?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_6222.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_6222.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1582029133746-96031e5c8d00?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_7451.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_7451.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.8 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1575868053350-9fd87f68f984?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_9815.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_9815.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.9 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1588391051471-1a5283d5a625?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_1025.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_1025.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.9 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1575314146619-ec67b6213351?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_6010.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_6010.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.1 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1579874107960-e602329ef20a?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_1004.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_1004.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">4.4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/flagged/photo-1551385229-2925ed4eb53d?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_8499.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_8499.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.4 MB</p>
-        </li>
-        <li class="relative">
-          <div class="aspect-w-10 aspect-h-7 group block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" x-state-description='undefined: "ring-2 ring-indigo-500 ring-offset-2", undefined: "focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100"'>
-            <img src="https://images.unsplash.com/photo-1498575637358-821023f27355?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=512&amp;q=80" alt="" class="pointer-events-none object-cover group-hover:opacity-75" x-state-description='undefined: "", undefined: "group-hover:opacity-75"' />
-            <button type="button" class="absolute inset-0 focus:outline-none">
-              <span class="sr-only">View details for IMG_2154.HEIC</span>
-            </button>
-          </div>
-          <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900">IMG_2154.HEIC</p>
-          <p class="pointer-events-none block text-sm font-medium text-gray-500">3.8 MB</p>
-        </li>
       </ul>
     </section>
   </div>
@@ -785,4 +556,50 @@ export async function viewer(fields, e) {
 `;
   e.$containerP.html(html);
+  const fetchWithTimeout = (url, options = {}, timeout = 600000) => {
+    // 100 seconds
+    const controller = new AbortController();
+    const { signal } = controller;
+    const timeoutPromise = new Promise((_, reject) =>
+      setTimeout(() => {
+        controller.abort();
+        reject(new Error("Request timed out"));
+      }, timeout)
+    );
+    const fetchPromise = fetch(url, { ...options, signal });
+    return Promise.race([fetchPromise, timeoutPromise]);
+  };
+  let opt = {};
+  try {
+    let domain =
+      e._session.engine_mode === "live_preview" ? `dev.xuda.io` : `xuda.io`;
+    const response = await fetchWithTimeout(
+      `https://${domain}/cpi/search_drive_files_workspace`,
+      {
+        method: "POST",
+        headers: {
+          Accept: "application/json",
+          "Content-Type": "application/json",
+          "xu-gtp-token": e_session.gtp_token,
+          "xu-app-token": e_session.app_token,
+        },
+        body: JSON.stringify(opt),
+      }
+    );
+    if (!response.ok) {
+      throw response.status;
+    }
+    const json = await response.json();
+    return json;
+  } catch (err) {
+    console.error(err);
+  }
 }