Release 202507061803

.vscode/extensions.json

@@ -7,7 +7,8 @@
     "golang.go",
     "bradlc.vscode-tailwindcss",
     "craigrbroughton.htmx-attributes",
-    "nefrob.vscode-just-syntax"
+    "nefrob.vscode-just-syntax",
+    "prisma.prisma"
   ],
   "unwantedRecommendations": []
 }

web/package-lock.json

@@ -11,7 +11,7 @@
         "@astrojs/check": "0.9.4",
         "@astrojs/db": "0.15.0",
         "@astrojs/mdx": "4.3.0",
-        "@astrojs/node": "9.2.2",
+        "@astrojs/node": "9.3.0",
         "@astrojs/rss": "4.0.12",
         "@astrojs/sitemap": "3.4.1",
         "@fontsource-variable/space-grotesk": "5.2.8",
@@ -22,7 +22,7 @@
         "@types/mime-types": "3.0.1",
         "@types/pg": "8.15.4",
         "@vercel/og": "0.6.8",
-        "astro": "5.10.1",
+        "astro": "5.11.0",
         "astro-loading-indicator": "0.7.0",
         "astro-remote": "0.3.4",
         "astro-seo-schema": "5.0.0",
@@ -51,8 +51,8 @@
         "web-push": "3.6.7"
       },
       "devDependencies": {
-        "@eslint/js": "9.30.0",
-        "@faker-js/faker": "9.8.0",
+        "@eslint/js": "9.30.1",
+        "@faker-js/faker": "9.9.0",
         "@iconify-json/material-symbols": "1.2.28",
         "@iconify-json/mdi": "1.2.3",
         "@iconify-json/ri": "1.2.5",
@@ -72,12 +72,12 @@
         "astro-icon": "1.1.5",
         "date-fns": "4.1.0",
         "esbuild": "0.25.5",
-        "eslint": "9.30.0",
+        "eslint": "9.30.1",
         "eslint-import-resolver-typescript": "4.4.4",
         "eslint-plugin-astro": "1.3.1",
         "eslint-plugin-import": "2.32.0",
         "eslint-plugin-jsx-a11y": "6.10.2",
-        "globals": "16.2.0",
+        "globals": "16.3.0",
         "prettier": "3.6.2",
         "prettier-plugin-astro": "0.14.1",
         "prettier-plugin-tailwindcss": "0.6.13",
@@ -297,9 +297,9 @@
       }
     },
     "node_modules/@astrojs/node": {
-      "version": "9.2.2",
-      "resolved": "https://registry.npmjs.org/@astrojs/node/-/node-9.2.2.tgz",
-      "integrity": "sha512-PtLPuuojmcl9O3CEvXqL/D+wB4x5DlbrGOvP0MeTAh/VfKFprYAzgw1+45xsnTO+QvPWb26l1cT+ZQvvohmvMw==",
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/@astrojs/node/-/node-9.3.0.tgz",
+      "integrity": "sha512-IV8NzGStHAsKBz1ljxxD8PBhBfnw/BEx/PZfsncTNXg9D4kQtZbSy+Ak0LvDs+rPmK0VeXLNn0HAdWuHCVg8cw==",
       "license": "MIT",
       "dependencies": {
         "@astrojs/internal-helpers": "0.6.1",
@@ -2641,9 +2641,9 @@
       }
     },
     "node_modules/@eslint/js": {
-      "version": "9.30.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.30.0.tgz",
-      "integrity": "sha512-Wzw3wQwPvc9sHM+NjakWTcPx11mbZyiYHuwWa/QfZ7cIRX7WK54PSk7bdyXDaoaopUcMatv1zaQvOAAO8hCdww==",
+      "version": "9.30.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.30.1.tgz",
+      "integrity": "sha512-zXhuECFlyep42KZUhWjfvsmXGX39W8K8LFb8AWXM9gSV9dQB+MrJGLKvW6Zw0Ggnbpw0VHTtrhFXYe3Gym18jg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2678,9 +2678,9 @@
       }
     },
     "node_modules/@faker-js/faker": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-9.8.0.tgz",
-      "integrity": "sha512-U9wpuSrJC93jZBxx/Qq2wPjCuYISBueyVUGK7qqdmj7r/nxaxwW8AQDCLeRO7wZnjj94sh3p246cAYjUKuqgfg==",
+      "version": "9.9.0",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-9.9.0.tgz",
+      "integrity": "sha512-OEl393iCOoo/z8bMezRlJu+GlRGlsKbUAN7jKB6LhnKoqKve5DXRpalbItIIcwnCjs1k/FOPjFzcA6Qn+H+YbA==",
       "dev": true,
       "funding": [
         {
@@ -6333,9 +6333,9 @@
       }
     },
     "node_modules/astro": {
-      "version": "5.10.1",
-      "resolved": "https://registry.npmjs.org/astro/-/astro-5.10.1.tgz",
-      "integrity": "sha512-DJVmt+51jU1xmgmAHCDwuUgcG/5aVFSU+tcX694acAZqPVt8EMUAmUZcJDX36Z7/EztnPph9HR3pm72jS2EgHQ==",
+      "version": "5.11.0",
+      "resolved": "https://registry.npmjs.org/astro/-/astro-5.11.0.tgz",
+      "integrity": "sha512-MEICntERthUxJPSSDsDiZuwiCMrsaYy3fnDhp4c6ScUfldCB8RBnB/myYdpTFXpwYBy6SgVsHQ1H4MuuA7ro/Q==",
       "license": "MIT",
       "dependencies": {
         "@astrojs/compiler": "^2.12.2",
@@ -9039,9 +9039,9 @@
       }
     },
     "node_modules/eslint": {
-      "version": "9.30.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.30.0.tgz",
-      "integrity": "sha512-iN/SiPxmQu6EVkf+m1qpBxzUhE12YqFLOSySuOyVLJLEF9nzTf+h/1AJYc1JWzCnktggeNrjvQGLngDzXirU6g==",
+      "version": "9.30.1",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.30.1.tgz",
+      "integrity": "sha512-zmxXPNMOXmwm9E0yQLi5uqXHs7uq2UIiqEKo3Gq+3fwo1XrJ+hijAZImyF7hclW3E6oHz43Yk3RP8at6OTKflQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9051,7 +9051,7 @@
         "@eslint/config-helpers": "^0.3.0",
         "@eslint/core": "^0.14.0",
         "@eslint/eslintrc": "^3.3.1",
-        "@eslint/js": "9.30.0",
+        "@eslint/js": "9.30.1",
         "@eslint/plugin-kit": "^0.3.1",
         "@humanfs/node": "^0.16.6",
         "@humanwhocodes/module-importer": "^1.0.1",
@@ -10401,9 +10401,9 @@
       }
     },
     "node_modules/globals": {
-      "version": "16.2.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-16.2.0.tgz",
-      "integrity": "sha512-O+7l9tPdHCU320IigZZPj5zmRCFG9xHmx9cU8FqU2Rp+JN714seHV+2S9+JslCpY4gJwU2vOGox0wzgae/MCEg==",
+      "version": "16.3.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-16.3.0.tgz",
+      "integrity": "sha512-bqWEnJ1Nt3neqx2q5SFfGS8r/ahumIakg3HcwtNlrVlwXIeNumWn/c7Pn/wKzGhf6SaW6H6uWXLqC30STCMchQ==",
       "dev": true,
       "license": "MIT",
       "engines": {

web/package.json

@@ -27,7 +27,7 @@
     "@astrojs/check": "0.9.4",
     "@astrojs/db": "0.15.0",
     "@astrojs/mdx": "4.3.0",
-    "@astrojs/node": "9.2.2",
+    "@astrojs/node": "9.3.0",
     "@astrojs/rss": "4.0.12",
     "@astrojs/sitemap": "3.4.1",
     "@fontsource-variable/space-grotesk": "5.2.8",
@@ -38,7 +38,7 @@
     "@types/mime-types": "3.0.1",
     "@types/pg": "8.15.4",
     "@vercel/og": "0.6.8",
-    "astro": "5.10.1",
+    "astro": "5.11.0",
     "astro-loading-indicator": "0.7.0",
     "astro-remote": "0.3.4",
     "astro-seo-schema": "5.0.0",
@@ -67,8 +67,8 @@
     "web-push": "3.6.7"
   },
   "devDependencies": {
-    "@eslint/js": "9.30.0",
-    "@faker-js/faker": "9.8.0",
+    "@eslint/js": "9.30.1",
+    "@faker-js/faker": "9.9.0",
     "@iconify-json/material-symbols": "1.2.28",
     "@iconify-json/mdi": "1.2.3",
     "@iconify-json/ri": "1.2.5",
@@ -88,12 +88,12 @@
     "astro-icon": "1.1.5",
     "date-fns": "4.1.0",
     "esbuild": "0.25.5",
-    "eslint": "9.30.0",
+    "eslint": "9.30.1",
     "eslint-import-resolver-typescript": "4.4.4",
     "eslint-plugin-astro": "1.3.1",
     "eslint-plugin-import": "2.32.0",
     "eslint-plugin-jsx-a11y": "6.10.2",
-    "globals": "16.2.0",
+    "globals": "16.3.0",
     "prettier": "3.6.2",
     "prettier-plugin-astro": "0.14.1",
     "prettier-plugin-tailwindcss": "0.6.13",

web/prisma/migrations/20250706140819_strict_commenting_enabled/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Service" ADD COLUMN     "strictCommentingEnabled" BOOLEAN NOT NULL DEFAULT false;

web/prisma/schema.prisma

@@ -406,6 +406,8 @@ model Service {
   Notification                    Notification[]
   affiliatedUsers                 ServiceUser[]             @relation("ServiceUsers")
 
+  strictCommentingEnabled Boolean @default(false)
+
   @@index([listedAt])
   @@index([approvedAt])
   @@index([verifiedAt])

web/prisma/seed.ts

@@ -720,6 +720,7 @@ const generateFakeService = (users: User[]) => {
       }),
       { probability: 0.33 }
     ),
+    strictCommentingEnabled: faker.datatype.boolean(0.33333),
   } as const satisfies Prisma.ServiceCreateInput
 }
 

web/prisma/triggers/01_karma_tx.sql

@@ -283,7 +283,7 @@ BEGIN
     -- and ensure it wasn't already APPROVED.
     IF OLD.status IS DISTINCT FROM 'APPROVED' AND NEW.status = 'APPROVED' THEN
         -- Fetch service details for the description
-        SELECT name, visibility INTO service_name, service_visibility FROM "Service" WHERE id = NEW."serviceId";
+        SELECT name, "serviceVisibility" INTO service_name, service_visibility FROM "Service" WHERE id = NEW."serviceId";
         
         -- Only award karma if the service is public
         IF service_visibility = 'PUBLIC' THEN

web/src/actions/admin/service.ts

@@ -63,6 +63,7 @@ const serviceSchemaBase = z.object({
   overallScore: zodCohercedNumber(z.number().int().min(0).max(10)).optional(),
   serviceVisibility: z.nativeEnum(ServiceVisibility),
   internalNote: z.string().optional(),
+  strictCommentingEnabled: z.boolean().optional().default(false),
 })
 
 // Define schema for the create action input
@@ -127,6 +128,7 @@ export const adminServiceActions = {
           verificationSummary: input.verificationSummary,
           verificationProofMd: input.verificationProofMd,
           acceptedCurrencies: input.acceptedCurrencies,
+          strictCommentingEnabled: input.strictCommentingEnabled,
           // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
           referral: input.referral || null,
           serviceVisibility: input.serviceVisibility,
@@ -247,6 +249,7 @@ export const adminServiceActions = {
           verificationSummary: input.verificationSummary,
           verificationProofMd: input.verificationProofMd,
           acceptedCurrencies: input.acceptedCurrencies,
+          strictCommentingEnabled: input.strictCommentingEnabled,
           // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
           referral: input.referral || null,
           serviceVisibility: input.serviceVisibility,

web/src/components/AnnouncementBanner.astro

@@ -85,7 +85,7 @@ const Tag = announcement.link ? 'a' : 'div'
   </div>
 
   {
-    !!announcement.linkText && (
+    !!announcement.link && !!announcement.linkText && (
       <div class="text-day-300 group-focus-visible:outline-primary transition-background 2xs:px-4 relative inline-flex h-full shrink-0 cursor-pointer items-center justify-center gap-1.5 overflow-hidden rounded-full border border-white/20 bg-black/10 p-[1px] px-1 py-1 text-sm font-medium shadow-sm backdrop-blur-3xl transition-colors group-hover:bg-white/5 group-focus-visible:ring-2 group-focus-visible:ring-blue-500 group-focus-visible:ring-offset-2 group-focus-visible:ring-offset-black/80 sm:min-w-[120px]">
         <span class="2xs:inline-block hidden">{announcement.linkText}</span>
         <Icon

web/src/components/CommentItem.astro

@@ -33,6 +33,7 @@ type Props = HTMLAttributes<'div'> & {
   highlightedCommentId: number | null
   serviceSlug: string
   itemReviewedId: string
+  strictCommentingEnabled?: boolean
 }
 
 const {
@@ -42,6 +43,7 @@ const {
   highlightedCommentId = null,
   serviceSlug,
   itemReviewedId,
+  strictCommentingEnabled,
   class: className,
   ...htmlProps
 } = Astro.props
@@ -492,6 +494,7 @@ const commentUrl = makeCommentUrl({ serviceSlug, commentId: comment.id, origin:
           serviceId={comment.serviceId}
           parentId={comment.id}
           commentId={comment.id}
+          strictCommentingEnabled={strictCommentingEnabled}
           class="mt-2 hidden peer-checked/collapse:hidden peer-checked/reply:block"
         />
       </>

web/src/components/CommentReply.astro

@@ -20,6 +20,7 @@ type Props = Omit<HTMLAttributes<'form'>, 'action' | 'enctype' | 'method'> & {
   serviceId: number
   parentId?: number
   commentId?: number
+  strictCommentingEnabled?: boolean
   activeRatingComment?: Prisma.CommentGetPayload<{
     select: {
       id: true
@@ -28,7 +29,15 @@ type Props = Omit<HTMLAttributes<'form'>, 'action' | 'enctype' | 'method'> & {
   }> | null
 }
 
-const { serviceId, parentId, commentId, activeRatingComment, class: className, ...htmlProps } = Astro.props
+const {
+  serviceId,
+  parentId,
+  commentId,
+  activeRatingComment,
+  strictCommentingEnabled,
+  class: className,
+  ...htmlProps
+} = Astro.props
 
 const MIN_COMMENT_LENGTH = parentId ? 10 : 30
 
@@ -117,6 +126,7 @@ const userCommentsDisabled = user ? user.karmaUnlocks.commentsDisabled : false
                       maxlength: 100,
                       placeholder: 'Order ID / URL / Proof',
                       class: 'bg-night-800',
+                      required: strictCommentingEnabled,
                     }}
                     descriptionLabel="Only visible to admins, to verify your comment"
                     class="grow"

web/src/components/CommentSection.astro

@@ -35,6 +35,7 @@ type Props = {
       name: true
       description: true
       createdAt: true
+      strictCommentingEnabled: true
     }
   }>
 }
@@ -173,7 +174,12 @@ function makeReplySchema(comment: CommentWithRepliesPopulated): Comment {
       comment: comments.map(makeReplySchema),
     } as WithContext<DiscussionForumPosting>}
   />
-  <CommentReply serviceId={service.id} activeRatingComment={activeRatingComment} class="xs:mb-4 mb-2" />
+  <CommentReply
+    serviceId={service.id}
+    activeRatingComment={activeRatingComment}
+    strictCommentingEnabled={service.strictCommentingEnabled}
+    class="xs:mb-4 mb-2"
+  />
 
   <div class="mb-6 flex flex-wrap items-center justify-between gap-2">
     <div class="flex items-center">
@@ -258,6 +264,7 @@ function makeReplySchema(comment: CommentWithRepliesPopulated): Comment {
             showPending={params.showPending}
             serviceSlug={service.slug}
             itemReviewedId={itemReviewedId}
+            strictCommentingEnabled={service.strictCommentingEnabled}
           />
         ))
       ) : (

web/src/components/InputCheckbox.astro

@@ -7,6 +7,8 @@ import type { ComponentProps } from 'astro/types'
 
 type Props = Pick<ComponentProps<typeof InputWrapper>, 'error' | 'name' | 'required'> & {
   disabled?: boolean
+  checked?: boolean
+  descriptionInline?: string
   id?: string
 } & (
     | {
@@ -19,13 +21,11 @@ type Props = Pick<ComponentProps<typeof InputWrapper>, 'error' | 'name' | 'requi
       }
   )
 
-const { disabled, name, required, error, id, label } = Astro.props
+const { disabled, name, required, error, id, label, checked, descriptionInline } = Astro.props
 
 const hasError = !!error && error.length > 0
 ---
 
-{}
-
 <div>
   <label
     class={cn(
@@ -41,9 +41,11 @@ const hasError = !!error && error.length > 0
       name={name}
       required={required}
       disabled={disabled}
+      checked={checked}
       class={cn(disabled && 'opacity-50')}
     />
     <span class="text-sm leading-none text-pretty">{label ?? <slot />}</span>
+    {descriptionInline && <p class="text-day-400 text-xs">{descriptionInline}</p>}
   </label>
 
   {

web/src/constants/readStatus.ts

@@ -0,0 +1,33 @@
+import { makeHelpersForOptions } from '../lib/makeHelpersForOptions'
+import { transformCase } from '../lib/strings'
+
+type ReadStatusInfo<T extends string | null | undefined = string> = {
+  id: T
+  label: string
+  readValue: boolean
+}
+
+export const {
+  dataArray: readStatuses,
+  getFn: getReadStatus,
+  zodEnumById: readStatusZodEnum,
+} = makeHelpersForOptions(
+  'id',
+  (id): ReadStatusInfo<typeof id> => ({
+    id,
+    label: id ? transformCase(id, 'title') : String(id),
+    readValue: false,
+  }),
+  [
+    {
+      id: 'unread',
+      label: 'Unread',
+      readValue: false,
+    },
+    {
+      id: 'read',
+      label: 'Read',
+      readValue: true,
+    },
+  ] as const satisfies ReadStatusInfo[]
+)

web/src/pages/admin/comments.astro

@@ -5,6 +5,7 @@ import { Icon } from 'astro-icon/components'
 import BadgeSmall from '../../components/BadgeSmall.astro'
 import CommentModeration from '../../components/CommentModeration.astro'
 import MyPicture from '../../components/MyPicture.astro'
+import Pagination from '../../components/Pagination.astro'
 import TimeFormatted from '../../components/TimeFormatted.astro'
 import UserBadge from '../../components/UserBadge.astro'
 import {
@@ -27,7 +28,7 @@ if (!user || (!user.admin && !user.moderator)) {
 const { data: params } = zodParseQueryParamsStoringErrors(
   {
     status: commentStatusFiltersZodEnum.default('all'),
-    page: z.number().int().positive().default(1),
+    page: z.coerce.number().int().positive().default(1),
   },
   Astro
 )
@@ -241,29 +242,5 @@ const totalPages = Math.ceil(totalComments / PAGE_SIZE)
   </div>
 
   <!-- Pagination -->
-  {
-    totalPages > 1 && (
-      <div class="mt-8 flex justify-center gap-2">
-        {params.page > 1 && (
-          <a
-            href={urlWithParams(Astro.url, { page: params.page - 1 })}
-            class="font-title rounded-md border border-zinc-700 px-3 py-1 text-sm transition-colors hover:border-green-500/50"
-          >
-            Previous
-          </a>
-        )}
-        <span class="font-title px-3 py-1 text-sm">
-          Page {params.page} of {totalPages}
-        </span>
-        {params.page < totalPages && (
-          <a
-            href={urlWithParams(Astro.url, { page: params.page + 1 })}
-            class="font-title rounded-md border border-zinc-700 px-3 py-1 text-sm transition-colors hover:border-green-500/50"
-          >
-            Next
-          </a>
-        )}
-      </div>
-    )
-  }
+  {totalPages > 1 && <Pagination currentPage={params.page} totalPages={totalPages} class="mt-8" />}
 </BaseLayout>

web/src/pages/admin/services/[slug]/edit.astro

@@ -10,6 +10,7 @@ import Button from '../../../../components/Button.astro'
 import FormSection from '../../../../components/FormSection.astro'
 import FormSubSection from '../../../../components/FormSubSection.astro'
 import InputCardGroup from '../../../../components/InputCardGroup.astro'
+import InputCheckbox from '../../../../components/InputCheckbox.astro'
 import InputCheckboxGroup from '../../../../components/InputCheckboxGroup.astro'
 import InputImageFile from '../../../../components/InputImageFile.astro'
 import InputSelect from '../../../../components/InputSelect.astro'
@@ -545,6 +546,13 @@ const apiCalls = await Astro.locals.banners.try(
           cardSize="sm"
         />
 
+        <InputCheckbox
+          label="Strict Commenting"
+          name="strictCommentingEnabled"
+          checked={service.strictCommentingEnabled}
+          descriptionInline="Require proof of being a client for comments."
+        />
+
         <InputSubmitButton label="Update" icon="ri:save-line" hideCancel />
       </form>
     </FormSection>

web/src/pages/admin/services/new.astro

@@ -3,6 +3,7 @@ import { AttributeCategory, Currency, VerificationStatus } from '@prisma/client'
 import { Icon } from 'astro-icon/components'
 import { actions, isInputError } from 'astro:actions'
 
+import InputCheckbox from '../../../components/InputCheckbox.astro'
 import BaseLayout from '../../../layouts/BaseLayout.astro'
 import { cn } from '../../../lib/cn'
 import { prisma } from '../../../lib/prisma'
@@ -368,6 +369,13 @@ const inputErrors = isInputError(result?.error) ? result.error.fields : {}
         }
       </div>
 
+      <InputCheckbox
+        label="Strict Commenting"
+        name="strictCommentingEnabled"
+        checked={false}
+        descriptionInline="Require proof of being a client for comments."
+      />
+
       <button
         type="submit"
         class="font-title inline-flex justify-center rounded-md border border-green-500/30 bg-green-500/10 px-4 py-2 text-sm text-green-400 shadow-xs transition-colors duration-200 hover:bg-green-500/20 focus:ring-2 focus:ring-green-500 focus:ring-offset-2 focus:ring-offset-black focus:outline-hidden"

web/src/pages/notifications.astro

@@ -5,10 +5,12 @@ import { actions } from 'astro:actions'
 
 import Button from '../components/Button.astro'
 import CopyButton from '../components/CopyButton.astro'
+import Pagination from '../components/Pagination.astro'
 import PushNotificationBanner from '../components/PushNotificationBanner.astro'
 import TimeFormatted from '../components/TimeFormatted.astro'
 import Tooltip from '../components/Tooltip.astro'
 import { getNotificationTypeInfo } from '../constants/notificationTypes'
+import { getReadStatus, readStatusZodEnum } from '../constants/readStatus'
 import BaseLayout from '../layouts/BaseLayout.astro'
 import { cn } from '../lib/cn'
 import { getOrCreateNotificationPreferences } from '../lib/notificationPreferences'
@@ -16,6 +18,10 @@ import { makeNotificationActions, makeNotificationContent, makeNotificationTitle
 import { zodParseQueryParamsStoringErrors } from '../lib/parseUrlFilters'
 import { prisma } from '../lib/prisma'
 import { makeLoginUrl } from '../lib/redirectUrls'
+import { transformCase } from '../lib/strings'
+import { urlWithParams } from '../lib/urls'
+
+import type { Prisma } from '@prisma/client'
 
 const user = Astro.locals.user
 if (!user) return Astro.redirect(makeLoginUrl(Astro.url))
@@ -25,20 +31,26 @@ const PAGE_SIZE = 20
 const { data: params } = zodParseQueryParamsStoringErrors(
   {
     page: z.coerce.number().int().min(1).default(1),
+    readStatus: readStatusZodEnum.optional(),
   },
   Astro
 )
 const skip = (params.page - 1) * PAGE_SIZE
 
+const readStatusInfo = params.readStatus ? getReadStatus(params.readStatus) : undefined
+
+const notificationWhereClause: Prisma.NotificationWhereInput = {
+  userId: user.id,
+  read: readStatusInfo?.readValue,
+}
+
 const [dbNotifications, notificationPreferences, totalNotifications, pushSubscriptions] =
   await Astro.locals.banners.tryMany([
     [
       'Error while fetching notifications',
       () =>
         prisma.notification.findMany({
-          where: {
-            userId: user.id,
-          },
+          where: notificationWhereClause,
           orderBy: {
             createdAt: 'desc',
           },
@@ -153,7 +165,7 @@ const [dbNotifications, notificationPreferences, totalNotifications, pushSubscri
     ],
     [
       'Error while fetching total notifications',
-      () => prisma.notification.count({ where: { userId: user.id } }),
+      () => prisma.notification.count({ where: notificationWhereClause }),
       0,
     ],
     [
@@ -227,13 +239,18 @@ const notifications = dbNotifications.map((notification) => ({
       )
     }
 
-    <div class="mb-4 flex items-center justify-between">
+    <div class="xs:flex-row xs:flex-wrap mb-4 flex flex-col items-center justify-between gap-2">
       <h1 class="font-title flex items-center text-2xl leading-tight font-bold tracking-wider">
         <Icon name="ri:notification-line" class="mr-2 size-6 text-zinc-400" />
-        Notifications
+
+        {transformCase(`${readStatusInfo?.label ?? ''} notifications`.trim(), 'sentence')}
       </h1>
 
-      <form method="POST" action={actions.notification.updateReadStatus}>
+      <form
+        method="POST"
+        action={actions.notification.updateReadStatus}
+        class="xs:justify-start flex flex-1 flex-row-reverse flex-wrap items-center justify-center gap-2"
+      >
         <input type="hidden" name="notificationId" value="all" />
         <input type="hidden" name="read" value="true" />
         <Button
@@ -243,6 +260,25 @@ const notifications = dbNotifications.map((notification) => ({
           disabled={notifications.length === 0}
           color="white"
         />
+        {
+          params.readStatus === 'unread' ? (
+            <Button
+              as="a"
+              href={urlWithParams(Astro.url, { readStatus: null }, { clearExisting: true })}
+              label="See all"
+              icon="ri:eye-line"
+              color="black"
+            />
+          ) : (
+            <Button
+              as="a"
+              href={urlWithParams(Astro.url, { readStatus: 'unread' }, { clearExisting: true })}
+              label="See unread only"
+              icon="ri:eye-off-line"
+              color="black"
+            />
+          )
+        }
       </form>
     </div>
 
@@ -323,31 +359,12 @@ const notifications = dbNotifications.map((notification) => ({
           ))}
 
           {totalPages > 1 && (
-            <div class="mt-8 flex justify-center gap-4">
-              <form method="GET" action="/notifications" class="inline">
-                <input type="hidden" name="page" value={params.page - 1} />
-                <button
-                  type="submit"
-                  class="rounded-md border border-zinc-700 bg-zinc-800 px-4 py-2 text-sm text-zinc-200 transition-colors duration-200 hover:bg-zinc-700"
-                  disabled={params.page <= 1}
-                >
-                  Previous
-                </button>
-              </form>
-              <span class="inline-flex items-center px-2 text-sm text-zinc-400">
-                Page {params.page} of {totalPages}
-              </span>
-              <form method="GET" action="/notifications" class="inline">
-                <input type="hidden" name="page" value={params.page + 1} />
-                <button
-                  type="submit"
-                  class="rounded-md border border-zinc-700 bg-zinc-800 px-4 py-2 text-sm text-zinc-200 transition-colors duration-200 hover:bg-zinc-700"
-                  disabled={params.page >= totalPages}
-                >
-                  Next
-                </button>
-              </form>
-            </div>
+            <Pagination
+              currentPage={params.page}
+              totalPages={totalPages}
+              currentUrl={Astro.url}
+              class="mt-8"
+            />
           )}
         </div>
       )

web/src/pages/service/[slug].astro

@@ -102,6 +102,7 @@ const [service, dbNotificationPreferences] = await Astro.locals.banners.tryMany(
           userSentimentAt: true,
           averageUserRating: true,
           isRecentlyApproved: true,
+          strictCommentingEnabled: true,
           contactMethods: {
             select: {
               value: true,
@@ -1533,6 +1534,20 @@ const activeEventToShow =
         <li>Moderation is light.</li>
         <li>Double-check before trusting.</li>
       </ul>
+
+      {
+        service.strictCommentingEnabled && (
+          <p class="mt-2">
+            <Icon
+              name="ri:verified-badge-fill"
+              class="me-0.5 inline-block size-4 align-[-0.3em] text-orange-100/95"
+            />
+            <span class="font-medium text-orange-100/95">Proof of being a client required</span>, for this
+            service.
+          </p>
+        )
+      }
+
       <div class="absolute inset-y-2 right-2 flex flex-col justify-center">
         <Icon name="ri:alert-line" class="xs:opacity-20 h-full max-h-16 w-auto opacity-10" />
       </div>

web/src/pages/sitemaps/search.xml.ts

@@ -7,186 +7,184 @@ import { makeSearchFiltersOptions } from '../../lib/searchFiltersOptions'
 import type { APIRoute } from 'astro'
 
 export const GET: APIRoute = async ({ site }) => {
-  if (!site) {
-    return new Response('Site URL not configured', { status: 500 })
-  }
+  if (!site) return new Response('Site URL not configured', { status: 500 })
 
-  const searchUrls = await generateSEOSitemapUrls(site.href)
+  try {
+    const searchUrls = await generateSEOSitemapUrls(site.href)
 
-  const result = `
+    const result = `
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   ${searchUrls.map((url) => `<url><loc>${he.encode(url)}</loc></url>`).join('\n')}
 </urlset>
   `.trim()
 
-  return new Response(result, {
-    headers: {
-      'Content-Type': 'application/xml',
-    },
-  })
+    return new Response(result, {
+      headers: {
+        'Content-Type': 'application/xml',
+      },
+    })
+  } catch (error) {
+    console.error('Failed to generate SEO sitemap URLs:', error)
+    return new Response('Failed to generate SEO sitemap URLs', { status: 500 })
+  }
 }
 
 async function generateSEOSitemapUrls(siteUrl: string) {
-  try {
-    const [categories, attributes] = await Promise.all([
-      prisma.category.findMany({
-        select: {
-          name: true,
-          namePluralLong: true,
-          slug: true,
-          icon: true,
-          _count: {
-            select: {
-              services: {
-                where: {
+  const [categories, attributes] = await Promise.all([
+    prisma.category.findMany({
+      select: {
+        name: true,
+        namePluralLong: true,
+        slug: true,
+        icon: true,
+        _count: {
+          select: {
+            services: {
+              where: {
+                serviceVisibility: { in: ['PUBLIC', 'ARCHIVED'] },
+              },
+            },
+          },
+        },
+      },
+    }),
+    prisma.attribute.findMany({
+      select: {
+        id: true,
+        slug: true,
+        title: true,
+        category: true,
+        type: true,
+        _count: {
+          select: {
+            services: {
+              where: {
+                service: {
                   serviceVisibility: { in: ['PUBLIC', 'ARCHIVED'] },
                 },
               },
             },
           },
         },
-      }),
-      prisma.attribute.findMany({
-        select: {
-          id: true,
-          slug: true,
-          title: true,
-          category: true,
-          type: true,
-          _count: {
-            select: {
-              services: {
-                where: {
-                  service: {
-                    serviceVisibility: { in: ['PUBLIC', 'ARCHIVED'] },
-                  },
-                },
-              },
-            },
-          },
-        },
-        orderBy: [{ category: 'asc' }, { type: 'asc' }, { title: 'asc' }],
-      }),
-    ])
+      },
+      orderBy: [{ category: 'asc' }, { type: 'asc' }, { title: 'asc' }],
+    }),
+  ])
 
-    const filtersOptions = makeSearchFiltersOptions({
-      filters: null,
-      categories,
-      attributes,
-    })
+  const filtersOptions = makeSearchFiltersOptions({
+    filters: null,
+    categories,
+    attributes,
+  })
 
-    const byCategory = filtersOptions.categories.map(
-      (category) =>
+  const byCategory = filtersOptions.categories.map(
+    (category) =>
+      new URLSearchParams({
+        categories: category.slug,
+      })
+  )
+
+  const byVerificationStatus = filtersOptions.verification.map(
+    (status) =>
+      new URLSearchParams({
+        verification: status.slug,
+      })
+  )
+
+  const byKycLevel = filtersOptions.kycLevels.map(
+    (level) =>
+      new URLSearchParams({
+        'max-kyc': level.id,
+      })
+  )
+
+  const byCurrency = filtersOptions.currencies.map(
+    (currency) =>
+      new URLSearchParams({
+        currencies: currency.slug,
+      })
+  )
+
+  const withOneAttribute = filtersOptions.attributesByCategory
+    .flatMap(({ attributes }) => attributes)
+    .map(
+      (attribute) =>
         new URLSearchParams({
-          categories: category.slug,
+          [`attr-${attribute.id.toString()}`]: 'yes',
+        })
+    )
+  const withoutOneAttribute = filtersOptions.attributesByCategory
+    .flatMap(({ attributes }) => attributes)
+    .map(
+      (attribute) =>
+        new URLSearchParams({
+          [`attr-${attribute.id.toString()}`]: 'no',
         })
     )
 
-    const byVerificationStatus = filtersOptions.verification.map(
-      (status) =>
-        new URLSearchParams({
-          verification: status.slug,
-        })
-    )
-
-    const byKycLevel = filtersOptions.kycLevels.map(
-      (level) =>
-        new URLSearchParams({
-          'max-kyc': level.id,
-        })
-    )
-
-    const byCurrency = filtersOptions.currencies.map(
+  const byCategoryAndCurrency = filtersOptions.categories.flatMap((category) =>
+    filtersOptions.currencies.map(
       (currency) =>
         new URLSearchParams({
+          categories: category.slug,
           currencies: currency.slug,
         })
     )
+  )
 
-    const withOneAttribute = filtersOptions.attributesByCategory
+  const byCategoryAndAttributes = filtersOptions.categories.flatMap((category) =>
+    filtersOptions.attributesByCategory
       .flatMap(({ attributes }) => attributes)
-      .map(
-        (attribute) =>
-          new URLSearchParams({
-            [`attr-${attribute.id.toString()}`]: 'yes',
-          })
-      )
-    const withoutOneAttribute = filtersOptions.attributesByCategory
+      .flatMap((attribute) => [
+        new URLSearchParams({
+          categories: category.slug,
+          [`attr-${attribute.id.toString()}`]: 'yes',
+        }),
+        new URLSearchParams({
+          categories: category.slug,
+          [`attr-${attribute.id.toString()}`]: 'no',
+        }),
+      ])
+  )
+
+  const relevantCurrencies = [
+    'xmr',
+    'btc',
+  ] as const satisfies (typeof filtersOptions.currencies)[number]['slug'][]
+
+  const byCategoryAndAttributesAndRelevantCurrency = filtersOptions.categories.flatMap((category) =>
+    filtersOptions.attributesByCategory
       .flatMap(({ attributes }) => attributes)
-      .map(
-        (attribute) =>
-          new URLSearchParams({
-            [`attr-${attribute.id.toString()}`]: 'no',
-          })
-      )
-
-    const byCategoryAndCurrency = filtersOptions.categories.flatMap((category) =>
-      filtersOptions.currencies.map(
-        (currency) =>
-          new URLSearchParams({
-            categories: category.slug,
-            currencies: currency.slug,
-          })
-      )
-    )
-
-    const byCategoryAndAttributes = filtersOptions.categories.flatMap((category) =>
-      filtersOptions.attributesByCategory
-        .flatMap(({ attributes }) => attributes)
-        .flatMap((attribute) => [
-          new URLSearchParams({
-            categories: category.slug,
-            [`attr-${attribute.id.toString()}`]: 'yes',
-          }),
-          new URLSearchParams({
-            categories: category.slug,
-            [`attr-${attribute.id.toString()}`]: 'no',
-          }),
-        ])
-    )
-
-    const relevantCurrencies = [
-      'xmr',
-      'btc',
-    ] as const satisfies (typeof filtersOptions.currencies)[number]['slug'][]
-
-    const byCategoryAndAttributesAndRelevantCurrency = filtersOptions.categories.flatMap((category) =>
-      filtersOptions.attributesByCategory
-        .flatMap(({ attributes }) => attributes)
-        .flatMap((attribute) =>
-          relevantCurrencies.map(
-            (currency) =>
-              new URLSearchParams({
-                categories: category.slug,
-                currencies: currency,
-                [`attr-${attribute.id.toString()}`]:
-                  attribute.type === 'GOOD' || attribute.type === 'INFO' ? 'yes' : 'no',
-              })
-          )
+      .flatMap((attribute) =>
+        relevantCurrencies.map(
+          (currency) =>
+            new URLSearchParams({
+              categories: category.slug,
+              currencies: currency,
+              [`attr-${attribute.id.toString()}`]:
+                attribute.type === 'GOOD' || attribute.type === 'INFO' ? 'yes' : 'no',
+            })
         )
-    )
+      )
+  )
 
-    const allQueryParams = [
-      ...byCategory,
-      ...byVerificationStatus,
-      ...byKycLevel,
-      ...byCurrency,
-      ...withOneAttribute,
-      ...withoutOneAttribute,
+  const allQueryParams = [
+    ...byCategory,
+    ...byVerificationStatus,
+    ...byKycLevel,
+    ...byCurrency,
+    ...withOneAttribute,
+    ...withoutOneAttribute,
 
-      ...byCategoryAndCurrency,
-      ...byCategoryAndAttributes,
-      ...byCategoryAndAttributesAndRelevantCurrency,
-    ] satisfies URLSearchParams[]
+    ...byCategoryAndCurrency,
+    ...byCategoryAndAttributes,
+    ...byCategoryAndAttributesAndRelevantCurrency,
+  ] satisfies URLSearchParams[]
 
-    return allQueryParams.map((queryParams) => {
-      const url = new URL(siteUrl)
-      url.search = queryParams.toString()
-      return url.href
-    })
-  } catch (error) {
-    console.error('Failed to generate SEO sitemap URLs:', error)
-    return []
-  }
+  return allQueryParams.map((queryParams) => {
+    const url = new URL(siteUrl)
+    url.search = queryParams.toString()
+    return url.href
+  })
 }