Apply feedback improvements: UBERF-9189 (#7778)

packages/presentation/src/link-preview.ts

@@ -33,10 +33,10 @@ export function canDisplayLinkPreview (val: LinkPreviewDetails): boolean {
   if (val.hostname === undefined) {
     return false
   }
-  if (val.image === undefined && val.description === undefined) {
+  if (val.image === undefined && val.description?.trim() === '') {
     return false
   }
-  if (val.title === undefined && val.description === undefined) {
+  if (val.title?.trim() === '' && val.description?.trim() === '') {
     return false
   }
   return true
@@ -53,7 +53,9 @@ export async function fetchLinkPreviewDetails (url: string, timeoutMs = 15000):
       headers: { Authorization: 'Bearer ' + token },
       signal: AbortSignal.timeout(timeoutMs)
     })
-    return response.json() as LinkPreviewDetails
+    const res = (await response.json()) as LinkPreviewDetails
+    res.url = url
+    return res
   } catch {
     return {}
   }

plugins/attachment-resources/src/components/AttachmentPresenter.svelte

@@ -115,7 +115,7 @@
         {#await getJsonOrEmpty(value.file, value.name)}
           <Spinner size="small" />
         {:then linkPreviewDetails}
-          <div class="flex-center icon">
+          <div class="flex-center icon image">
             {#if linkPreviewDetails.icon !== undefined && !useDefaultIcon}
               <img
                 src={linkPreviewDetails.icon}

plugins/attachment-resources/src/components/AttachmentRefInput.svelte

@@ -333,7 +333,7 @@
     const hrefs = refContainer.getElementsByTagName('a')
     const newUrls: string[] = []
     for (let i = 0; i < hrefs.length; i++) {
-      if (hrefs[i].target !== '_blank' || !isValidUrl(hrefs[i].href)) {
+      if (hrefs[i].target !== '_blank' || !isValidUrl(hrefs[i].href) || hrefs[i].rel === '') {
         continue
       }
       const key = getUrlKey(hrefs[i].href)
@@ -363,7 +363,7 @@
         if (canDisplayLinkPreview(meta) && meta.url !== undefined) {
           const blob = new Blob([JSON.stringify(meta)])
           const file = new File([blob], meta.url, { type: 'application/link-preview' })
-          void createAttachment(file)
+          await createAttachment(file)
         }
       } catch (err: any) {
         void setPlatformStatus(unknownError(err))

plugins/attachment-resources/src/components/LinkPreviewList.svelte

@@ -17,12 +17,14 @@
   import LinkPreviewPresenter from './LinkPreviewPresenter.svelte'
   import { type WithLookup } from '@hcengineering/core'
   import { type Attachment } from '@hcengineering/attachment'
-
+  import { Scroller } from '@hcengineering/ui'
   export let attachments: WithLookup<Attachment>[] = []
 </script>
 
 <div class="gapV-2">
   {#each attachments as attachment}
-    <LinkPreviewPresenter {attachment} />
+    <Scroller contentDirection={'horizontal'} horizontal scrollSnap>
+      <LinkPreviewPresenter {attachment} />
+    </Scroller>
   {/each}
 </div>

plugins/attachment-resources/src/components/LinkPreviewPresenter.svelte

@@ -33,7 +33,7 @@
 <div class="quote content">
   {#if canDisplay}
     <div class="gapV-2">
-      <div class="flex gap-1">
+      <div class="flex-row-center gap-1">
         {#if viewModel.icon !== undefined && !useDefaultIcon}
           <img
             src={viewModel.icon}
@@ -81,14 +81,15 @@
     max-height: 25rem;
   }
   .preview-icon {
-    max-width: 22px;
-    max-height: 22px;
+    max-width: 16px;
+    max-height: 16px;
   }
   .quote {
     border-left: 0.25rem solid;
-    padding-left: 15px;
+    padding-left: 0.75rem;
   }
   .content {
+    scroll-snap-align: start;
     max-width: 35rem;
     max-height: 35rem;
   }