Release 202506141856

web/src/components/BaseHead.astro

@@ -6,7 +6,7 @@ import { pwaAssetsHead } from 'virtual:pwa-assets/head'
 import { pwaInfo } from 'virtual:pwa-info'
 
 import { isNotArray } from '../lib/arrays'
-import { DEPLOYMENT_MODE } from '../lib/envVariables'
+import { DEPLOYMENT_MODE } from '../lib/client/envVariables'
 
 import DevToolsMessageScript from './DevToolsMessageScript.astro'
 import DynamicFavicon from './DynamicFavicon.astro'

web/src/components/CommentItem.astro

@@ -15,6 +15,7 @@ import {
 } from '../lib/commentsWithReplies'
 import { computeKarmaUnlocks } from '../lib/karmaUnlocks'
 import { formatDateShort } from '../lib/timeAgo'
+import { urlDomain } from '../lib/urls'
 
 import BadgeSmall from './BadgeSmall.astro'
 import CommentModeration from './CommentModeration.astro'
@@ -170,7 +171,7 @@ const commentUrl = makeCommentUrl({ serviceSlug, commentId: comment.id, origin:
               comment.author.admin || comment.author.moderator
                 ? `KYCnot.me ${comment.author.admin ? 'Admin' : 'Moderator'}${comment.author.verifiedLink ? '. ' : ''}`
                 : ''
-            }${comment.author.verifiedLink ? `Related to ${comment.author.verifiedLink}` : ''}`}
+            }${comment.author.verifiedLink ? `Related to ${urlDomain(comment.author.verifiedLink)}` : ''}`}
           >
             <Icon name="ri:verified-badge-fill" class="size-4 text-cyan-300" />
           </Tooltip>

web/src/components/DynamicFavicon.astro

@@ -1,5 +1,5 @@
 ---
-import { DEPLOYMENT_MODE } from '../lib/envVariables'
+import { DEPLOYMENT_MODE } from '../lib/client/envVariables'
 import { prisma } from '../lib/prisma'
 
 const user = Astro.locals.user

web/src/components/Header.astro

@@ -3,8 +3,8 @@ import { Icon } from 'astro-icon/components'
 import { sample } from 'lodash-es'
 
 import { splashTexts } from '../constants/splashTexts'
+import { DEPLOYMENT_MODE } from '../lib/client/envVariables'
 import { cn } from '../lib/cn'
-import { DEPLOYMENT_MODE } from '../lib/envVariables'
 import { makeLoginUrl, makeUnimpersonateUrl } from '../lib/redirectUrls'
 
 import AdminOnly from './AdminOnly.astro'

web/src/components/InputCardGroup.astro

@@ -20,7 +20,6 @@ type Props<Multiple extends boolean = false> = Omit<
     iconClass?: string
     description?: MarkdownString
     disabled?: boolean
-    noTransitionPersist?: boolean
   }[]
   disabled?: boolean
   selectedValue?: Multiple extends true ? string[] : string
@@ -70,7 +69,7 @@ const hasError = !!wrapperProps.error && wrapperProps.error.length > 0
           )}
         >
           <input
-            transition:persist={option.noTransitionPersist || !multiple ? undefined : true}
+            transition:persist
             type={multiple ? 'checkbox' : 'radio'}
             name={wrapperProps.name}
             value={option.value}

web/src/components/NotificationEventsScript.astro

@@ -4,14 +4,17 @@
 
 <script>
   import { isBrowserNotificationsEnabled, showBrowserNotification } from '../lib/client/browserNotifications'
-  import { makeNotificationOptions } from '../lib/notificationOptions'
+  import {
+    makeBrowserNotificationOptions,
+    makeBrowserNotificationTitle,
+  } from '../lib/client/notificationOptions'
 
   document.addEventListener('sse:new-notification', (event) => {
     if (isBrowserNotificationsEnabled()) {
       const payload = event.detail
       const notification = showBrowserNotification(
-        payload.title,
-        makeNotificationOptions(payload, { removeActions: true })
+        makeBrowserNotificationTitle(payload.title),
+        makeBrowserNotificationOptions(payload, { removeActions: true })
       )
 
       // Handle notification click

web/src/components/VerificationWarningBanner.astro

@@ -1,24 +1,21 @@
 ---
 import { Icon } from 'astro-icon/components'
-import { differenceInDays, isPast } from 'date-fns'
+import { differenceInDays } from 'date-fns'
 
 import { verificationStatusesByValue } from '../constants/verificationStatus'
 import { verificationStepStatusesByValue } from '../constants/verificationStepStatus'
 import { cn } from '../lib/cn'
 
-import TimeFormatted from './TimeFormatted.astro'
-
 import type { Prisma } from '@prisma/client'
 
-const RECENTLY_ADDED_DAYS = 7
-
 type Props = {
   service: Prisma.ServiceGetPayload<{
     select: {
       verificationStatus: true
       verificationProofMd: true
       verificationSummary: true
-      listedAt: true
+      approvedAt: true
+      isRecentlyApproved: true
       createdAt: true
       verificationSteps: {
         select: {
@@ -31,8 +28,14 @@ type Props = {
 
 const { service } = Astro.props
 
-const listedDate = service.listedAt ?? service.createdAt
-const wasRecentlyAdded = isPast(listedDate) && differenceInDays(new Date(), listedDate) < RECENTLY_ADDED_DAYS
+function formatApprovedAt(approvedAt: Date | null) {
+  if (!approvedAt) return 'less than 15 days ago'
+
+  const days = differenceInDays(new Date(), approvedAt)
+  if (days === 0) return 'today'
+  if (days === 1) return 'yesterday'
+  return `${days.toLocaleString()} days ago`
+}
 ---
 
 {
@@ -67,10 +70,10 @@ const wasRecentlyAdded = isPast(listedDate) && differenceInDays(new Date(), list
         </a>
       </span>
     </div>
-  ) : wasRecentlyAdded ? (
+  ) : service.isRecentlyApproved ? (
     <div class="mb-3 rounded-md bg-yellow-900/50 p-2 text-sm text-yellow-400">
-      This service was {service.listedAt === null ? 'added ' : 'listed '}{' '}
-      <TimeFormatted date={listedDate} daysUntilDate={RECENTLY_ADDED_DAYS} />
+      This service was approved
+      {formatApprovedAt(service.approvedAt)}
       {service.verificationStatus !== 'VERIFICATION_SUCCESS' && ' and it is not verified'}. Proceed with
       caution.
       <a
@@ -87,7 +90,7 @@ const wasRecentlyAdded = isPast(listedDate) && differenceInDays(new Date(), list
         Basic checks passed, but not fully verified.
         <a
           href="/about#suggestion-review-process"
-          class="text-yellow-100 underline opacity-50 transition-opacity hover:opacity-100 focus-visible:opacity-100"
+          class="text-blue-100 underline opacity-50 transition-opacity hover:opacity-100 focus-visible:opacity-100"
         >
           Learn more
         </a>