---
import { z } from 'astro:schema'
import { groupBy, omit, orderBy, sortBy, uniq } from 'lodash-es'
import seedrandom from 'seedrandom'

import Button from '../components/Button.astro'
import InputText from '../components/InputText.astro'
import Pagination from '../components/Pagination.astro'
import ServiceFiltersPill from '../components/ServiceFiltersPill.astro'
import ServicesFilters from '../components/ServicesFilters.astro'
import ServicesSearchResults from '../components/ServicesSearchResults.astro'
import { getAttributeCategoryInfo } from '../constants/attributeCategories'
import { getAttributeTypeInfo } from '../constants/attributeTypes'
import {
  currencies,
  currenciesZodEnumBySlug,
  currencySlugToId,
  getCurrencyInfo,
} from '../constants/currencies'
import { getNetworkInfo, networks } from '../constants/networks'
import {
  getVerificationStatusInfo,
  verificationStatuses,
  verificationStatusesZodEnumBySlug,
  verificationStatusSlugToId,
} from '../constants/verificationStatus'
import BaseLayout from '../layouts/BaseLayout.astro'
import { areEqualArraysWithoutOrder, zodEnumFromConstant } from '../lib/arrays'
import { findServicesBySimilarity } from '../lib/findServicesBySimilarity'
import { parseIntWithFallback } from '../lib/numbers'
import { areEqualObjectsWithoutOrder } from '../lib/objects'
import { zodParseQueryParamsStoringErrors } from '../lib/parseUrlFilters'
import { prisma } from '../lib/prisma'
import { makeSortSeed } from '../lib/sortSeed'
import { transformCase } from '../lib/strings'

import type { Prisma } from '@prisma/client'

const MIN_CATEGORIES_TO_SHOW = 8
const MIN_ATTRIBUTES_TO_SHOW = 8

const PAGE_SIZE = 30

const sortOptions = [
  {
    value: 'score-desc',
    label: 'Score (High → Low)',
    orderBy: {
      key: 'overallScore',
      direction: 'desc',
    },
  },
  {
    value: 'score-asc',
    label: 'Score (Low → High)',
    orderBy: {
      key: 'overallScore',
      direction: 'asc',
    },
  },
  {
    value: 'name-asc',
    label: 'Name (A → Z)',
    orderBy: {
      key: 'name',
      direction: 'asc',
    },
  },
  {
    value: 'name-desc',
    label: 'Name (Z → A)',
    orderBy: {
      key: 'name',
      direction: 'desc',
    },
  },
  {
    value: 'recent',
    label: 'Date listed (New → Old)',
    orderBy: {
      key: 'listedAt',
      direction: 'desc',
    },
  },
  {
    value: 'oldest',
    label: 'Date listed (Old → New)',
    orderBy: {
      key: 'listedAt',
      direction: 'asc',
    },
  },
] as const satisfies {
  value: string
  label: string
  orderBy: {
    key: keyof Prisma.ServiceSelect
    direction: 'asc' | 'desc'
  }
}[]

const defaultSortOption = sortOptions[0]

const modeOptions = [
  {
    value: 'or',
    label: 'OR',
  },
  {
    value: 'and',
    label: 'AND',
  },
] as const satisfies {
  value: string
  label: string
}[]

const attributeOptions = [
  {
    value: 'yes',
    prefix: 'Has',
  },
  {
    value: 'no',
    prefix: 'Not',
  },
  {
    value: '',
    prefix: '',
  },
] as const satisfies {
  value: string
  prefix: string
}[]

const ignoredKeysForDefaultData = ['sort-seed']

const {
  data: filters,
  hasDefaultData: hasDefaultFilters,
  defaultData: defaultFilters,
  redirectUrl,
} = zodParseQueryParamsStoringErrors(
  {
    categories: z.array(z.string()),
    verification: z
      .array(verificationStatusesZodEnumBySlug.transform((slug) => verificationStatusSlugToId(slug)))
      .default(
        verificationStatuses
          .filter((verification) => verification.default)
          .map((verification) => verification.slug)
      ),
    'min-score': z.coerce.number().default(0),
    'user-rating': z.coerce.number().int().min(0).max(5).default(0),
    q: z.string().default(''),
    currencies: z.array(currenciesZodEnumBySlug.transform((slug) => currencySlugToId(slug))),
    'currency-mode': zodEnumFromConstant(modeOptions, 'value').default('or'),
    'attribute-mode': zodEnumFromConstant(modeOptions, 'value').default('or'),
    sort: zodEnumFromConstant(sortOptions, 'value').default(defaultSortOption.value),
    'sort-seed': z
      .string()
      .transform((seed) => (Astro.url.searchParams.has('page') ? seed : makeSortSeed()))
      .default(makeSortSeed()),
    'max-kyc': z.coerce.number().int().min(0).max(4).default(4),
    networks: z.array(zodEnumFromConstant(networks, 'slug')),
    attr: z
      .record(z.coerce.number().int().positive(), zodEnumFromConstant(attributeOptions, 'value'))
      .optional(),
    page: z.coerce.number().int().min(1).default(1),
  },
  Astro,
  {
    ignoredKeysForDefaultData,
    cleanUrl: {
      removeUneededObjectParams: true,
      removeParams: {
        verification: { if: 'default' },
        q: { if: 'default' },
        sort: { if: 'default' },
        'currency-mode': { if: 'another-is-unset', prop: 'currencies' },
        'attribute-mode': { if: 'another-is-unset', prop: 'attr' },
        'min-score': { if: 'default' },
        'user-rating': { if: 'default' },
        'max-kyc': { if: 'default' },
        'sort-seed': { if: 'another-is-unset', prop: 'page' },
      },
    },
  }
)

const hasDefaultFiltersIgnoringQ = areEqualObjectsWithoutOrder(
  omit(filters, [...ignoredKeysForDefaultData, 'q']),
  omit(defaultFilters, [...ignoredKeysForDefaultData, 'q'])
)

if (redirectUrl) return Astro.redirect(redirectUrl.toString())

const includeScams =
  !!filters.q &&
  (areEqualArraysWithoutOrder(filters.verification, ['VERIFICATION_SUCCESS', 'APPROVED']) ||
    areEqualArraysWithoutOrder(filters.verification, [
      'VERIFICATION_SUCCESS',
      'APPROVED',
      'COMMUNITY_CONTRIBUTED',
    ]))

export type ServicesFiltersObject = typeof filters

const groupedAttributes = groupBy(
  Object.entries(filters.attr ?? {}).flatMap(([key, value]) => {
    const id = parseIntWithFallback(key)
    if (id === null) return []
    return [{ id, value }]
  }),
  'value'
)

const servicesQMatch = filters.q ? await findServicesBySimilarity(filters.q) : null

const where = {
  id: servicesQMatch ? { in: servicesQMatch.map(({ id }) => id) } : undefined,
  categories: filters.categories.length ? { some: { slug: { in: filters.categories } } } : undefined,
  verificationStatus: {
    in: includeScams ? uniq([...filters.verification, 'VERIFICATION_FAILED'] as const) : filters.verification,
  },
  serviceVisibility: { in: ['PUBLIC', 'ARCHIVED'] },
  overallScore: { gte: filters['min-score'] },
  acceptedCurrencies: filters.currencies.length
    ? filters['currency-mode'] === 'and'
      ? { hasEvery: filters.currencies }
      : { hasSome: filters.currencies }
    : undefined,
  kycLevel: {
    lte: filters['max-kyc'],
  },
  AND: [
    ...(filters['user-rating'] > 0
      ? [
          {
            averageUserRating: {
              gte: filters['user-rating'],
            },
          } satisfies Prisma.ServiceWhereInput,
        ]
      : []),
    ...(filters.networks.length
      ? [
          {
            OR: [
              ...(filters.networks.includes('onion') ? [{ onionUrls: { isEmpty: false } }] : []),
              ...(filters.networks.includes('i2p') ? [{ i2pUrls: { isEmpty: false } }] : []),
              ...(filters.networks.includes('clearnet') ? [{ serviceUrls: { isEmpty: false } }] : []),
            ],
          } satisfies Prisma.ServiceWhereInput,
        ]
      : []),
    ...(filters.attr && (groupedAttributes.yes?.length ?? 0) + (groupedAttributes.no?.length ?? 0) > 0
      ? [
          {
            AND: [
              ...(groupedAttributes.yes && groupedAttributes.yes.length > 0
                ? [
                    {
                      [filters['attribute-mode'] === 'and' ? 'AND' : 'OR']: groupedAttributes.yes.map(
                        ({ id }) =>
                          ({
                            attributes: {
                              some: {
                                attribute: {
                                  id,
                                },
                              },
                            },
                          }) satisfies Prisma.ServiceWhereInput
                      ),
                    },
                  ]
                : []),
              ...(groupedAttributes.no && groupedAttributes.no.length > 0
                ? [
                    {
                      [filters['attribute-mode'] === 'and' ? 'AND' : 'OR']: groupedAttributes.no.map(
                        ({ id }) =>
                          ({
                            attributes: {
                              none: {
                                attribute: {
                                  id,
                                },
                              },
                            },
                          }) satisfies Prisma.ServiceWhereInput
                      ),
                    },
                  ]
                : []),
            ],
          },
        ]
      : []),
  ],
} as const satisfies Prisma.ServiceWhereInput

const [categories, [services, totalServices], countCommunityOnly, attributes] =
  await Astro.locals.banners.tryMany([
    [
      'Unable to load category filters.',
      () =>
        prisma.category.findMany({
          select: {
            name: true,
            slug: true,
            icon: true,
            _count: {
              select: {
                services: {
                  where: {
                    serviceVisibility: { in: ['PUBLIC', 'ARCHIVED'] },
                  },
                },
              },
            },
          },
        }),
    ],
    [
      'Unable to load services.',
      async () => {
        const [unsortedServicesMissingSimilarityScore, totalServices] = await prisma.service.findManyAndCount(
          {
            where,
            select: {
              id: true,
              serviceVisibility: true,
              verificationStatus: true,
              ...(Object.fromEntries(sortOptions.map((option) => [option.orderBy.key, true])) as Record<
                (typeof sortOptions)[number]['orderBy']['key'],
                true
              >),
            },
          }
        )

        const unsortedServices = unsortedServicesMissingSimilarityScore.map((service) => ({
          ...service,
          similarityScore: servicesQMatch?.find((match) => match.id === service.id)?.similarityScore ?? 0,
        }))

        const rng = seedrandom(filters['sort-seed'])
        const selectedSort = sortOptions.find((sort) => sort.value === filters.sort) ?? defaultSortOption

        const sortedServices = orderBy(
          // NOTE: We do a first sort by id to make the seeded sort deterministic
          sortBy(unsortedServices, 'id'),
          [
            ...(filters.q ? (['similarityScore'] as const) : ([] as const)),
            (service) => (service.verificationStatus === 'VERIFICATION_FAILED' ? 1 : 0),
            (service) => (service.serviceVisibility === 'ARCHIVED' ? 1 : 0),
            selectedSort.orderBy.key,
            () => rng(),
          ],
          [
            ...(filters.q ? (['desc'] as const) : ([] as const)),
            'asc',
            'asc',
            selectedSort.orderBy.direction,
            'asc',
          ]
        ).slice((filters.page - 1) * PAGE_SIZE, filters.page * PAGE_SIZE)

        const unsortedServicesWithInfoMissingSimilarityScore = await prisma.service.findMany({
          where: {
            id: {
              in: sortedServices.map((service) => service.id),
            },
          },
          select: {
            id: true,
            name: true,
            slug: true,
            description: true,
            overallScore: true,
            privacyScore: true,
            trustScore: true,
            kycLevel: true,
            imageUrl: true,
            verificationStatus: true,
            acceptedCurrencies: true,
            serviceVisibility: true,
            attributes: {
              select: {
                attribute: {
                  select: {
                    id: true,
                    slug: true,
                    title: true,
                    category: true,
                    type: true,
                  },
                },
              },
            },
            categories: {
              select: {
                name: true,
                icon: true,
              },
            },
          },
        })

        const unsortedServicesWithInfo = unsortedServicesWithInfoMissingSimilarityScore.map((service) => ({
          ...service,
          similarityScore: servicesQMatch?.find((match) => match.id === service.id)?.similarityScore ?? 0,
        }))

        const sortedServicesWithInfo = orderBy(
          unsortedServicesWithInfo,
          [
            ...(filters.q ? (['similarityScore'] as const) : ([] as const)),
            (service) => (service.verificationStatus === 'VERIFICATION_FAILED' ? 1 : 0),
            (service) => (service.serviceVisibility === 'ARCHIVED' ? 1 : 0),
            selectedSort.orderBy.key,
            // Now we can shuffle indeternimistically, because the pagination was already applied
            () => Math.random(),
          ],
          [
            ...(filters.q ? (['desc'] as const) : ([] as const)),
            'asc',
            'asc',
            selectedSort.orderBy.direction,
            'asc',
          ]
        )

        return [sortedServicesWithInfo, totalServices] as const
      },
      [[] as [], 0, false] as const,
    ],
    [
      'Unable to load count if including community.',
      () =>
        areEqualArraysWithoutOrder(filters.verification, ['VERIFICATION_SUCCESS', 'APPROVED']) ||
        areEqualArraysWithoutOrder(filters.verification, [
          'VERIFICATION_SUCCESS',
          'APPROVED',
          'VERIFICATION_FAILED',
        ])
          ? prisma.service.count({
              where: {
                ...where,
                verificationStatus: 'COMMUNITY_CONTRIBUTED',
              },
            })
          : null,
      null,
    ],
    [
      'Unable to load attribute filters.',
      () =>
        prisma.attribute.findMany({
          select: {
            id: true,
            slug: true,
            title: true,
            category: true,
            type: true,
            _count: {
              select: {
                services: true,
              },
            },
          },
          orderBy: [{ category: 'asc' }, { type: 'asc' }, { title: 'asc' }],
        }),
      [],
    ],
  ])

const attributesByCategory = orderBy(
  Object.entries(
    groupBy(
      attributes.map((attr) => {
        return {
          typeInfo: getAttributeTypeInfo(attr.type),
          ...attr,
          // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
          value: filters.attr?.[attr.id] || undefined,
        }
      }),
      'category'
    )
  ).map(([category, attributes]) => ({
    category,
    categoryInfo: getAttributeCategoryInfo(category),
    attributes: orderBy(
      attributes,
      ['value', 'type', '_count.services', 'title'],
      ['asc', 'asc', 'desc', 'asc']
    ).map((attr, i) => ({
      ...attr,
      showAlways: i < MIN_ATTRIBUTES_TO_SHOW || attr.value !== undefined,
    })),
  })),
  ['category'],
  ['asc']
)

const categoriesSorted = orderBy(
  categories?.map((category) => {
    const checked = filters.categories.includes(category.slug)

    return {
      ...category,
      checked,
    }
  }),
  ['checked', '_count.services', 'name'],
  ['desc', 'desc', 'asc']
).map((category, i) => ({
  ...category,
  showAlways: i < MIN_CATEGORIES_TO_SHOW || category.checked,
}))

const filtersOptions = {
  currencies,
  categories: categoriesSorted,
  sort: sortOptions,
  modeOptions,
  network: networks,
  verification: verificationStatuses,
  attributesByCategory,
} as const

export type ServicesFiltersOptions = typeof filtersOptions

const searchResultsId = 'search-results'
const showFiltersId = 'show-filters'
---

<BaseLayout
  pageTitle="Find KYC-free Services"
  description="Find services that don't require KYC (Know Your Customer) verification for better privacy and control over your data."
  widthClassName="max-w-none"
  htmx
  showSplashText
  breadcrumbs={[
    {
      name: 'Services',
      url: '/',
    },
  ]}
>
  <div class="flex flex-col gap-4 sm:flex-row sm:gap-8">
    <div
      class='[&:has(~_#show-filters:focus-visible)_[for="show-filters"]]:ring-offset-night-700 flex items-stretch sm:hidden [&:has(~_#show-filters:focus-visible)_[for="show-filters"]]:ring-2 [&:has(~_#show-filters:focus-visible)_[for="show-filters"]]:ring-green-500 [&:has(~_#show-filters:focus-visible)_[for="show-filters"]]:ring-offset-2'
    >
      {
        hasDefaultFilters || hasDefaultFiltersIgnoringQ ? (
          <form
            method="GET"
            hx-get={Astro.url.pathname}
            hx-trigger="input delay:500ms, keyup[key=='Enter']"
            hx-target={`#${searchResultsId}`}
            hx-select={`#${searchResultsId}`}
            hx-swap="outerHTML"
            hx-push-url="true"
            hx-indicator="#search-indicator"
            class="contents"
          >
            <InputText
              name="q"
              label="Search..."
              hideLabel
              inputIcon="ri:search-line"
              inputIconClass="text-day-500 size-4.5"
              inputProps={{
                placeholder: 'Search',
                value: filters.q,
                class: 'bg-night-800 border-night-500',
                'transition:persist': false,
              }}
              class="mr-4 flex-1"
            />
          </form>
        ) : (
          <div class="-ml-4 flex flex-1 items-center gap-2 overflow-x-auto mask-r-from-[calc(100%-var(--spacing)*16)] pr-12 pl-4">
            {filters.q && (
              <ServiceFiltersPill text={`"${filters.q}"`} searchParamName="q" searchParamValue={filters.q} />
            )}

            {!areEqualArraysWithoutOrder(
              filters.verification,
              filtersOptions.verification
                .filter((verification) => verification.default)
                .map((verification) => verification.value)
            ) &&
              filters.verification.map((verificationStatus) => {
                const verificationStatusInfo = getVerificationStatusInfo(verificationStatus)

                return (
                  <ServiceFiltersPill
                    text={verificationStatusInfo.label}
                    icon={verificationStatusInfo.icon}
                    iconClass={verificationStatusInfo.classNames.icon}
                    searchParamName="verification"
                    searchParamValue={verificationStatusInfo.slug}
                  />
                )
              })}

            {filters.categories.map((categorySlug) => {
              const category = categories?.find((c) => c.slug === categorySlug)
              if (!category) return null

              return (
                <ServiceFiltersPill
                  text={category.name}
                  icon={category.icon}
                  searchParamName="categories"
                  searchParamValue={categorySlug}
                />
              )
            })}
            {filters.currencies.map((currencyId) => {
              const currency = getCurrencyInfo(currencyId)

              return (
                <ServiceFiltersPill
                  text={currency.name}
                  searchParamName="currencies"
                  searchParamValue={currency.slug}
                  icon={currency.icon}
                />
              )
            })}
            {filters.networks.map((network) => {
              const networkOption = getNetworkInfo(network)

              return (
                <ServiceFiltersPill
                  text={networkOption.name}
                  icon={networkOption.icon}
                  searchParamName="networks"
                  searchParamValue={network}
                />
              )
            })}
            {filters['max-kyc'] < 4 && (
              <ServiceFiltersPill
                text={`KYC Lvl ≤ ${filters['max-kyc'].toLocaleString()}`}
                icon="ri:shield-keyhole-line"
                searchParamName="max-kyc"
              />
            )}
            {filters['user-rating'] > 0 && (
              <ServiceFiltersPill
                text={`Rating ≥ ${filters['user-rating'].toLocaleString()}★`}
                icon="ri:star-fill"
                searchParamName="user-rating"
              />
            )}
            {filters['min-score'] > 0 && (
              <ServiceFiltersPill
                text={`Score ≥ ${filters['min-score'].toLocaleString()}`}
                icon="ri:medal-line"
                searchParamName="min-score"
              />
            )}
            {filters['attribute-mode'] === 'and' && filters.attr && Object.keys(filters.attr).length > 1 && (
              <ServiceFiltersPill
                text="Attributes: AND"
                icon="ri:filter-3-line"
                searchParamName="attribute-mode"
                searchParamValue="and"
              />
            )}
            {filters.attr &&
              Object.entries(filters.attr)
                .filter((entry): entry is [string, 'no' | 'yes'] => entry[1] === 'yes' || entry[1] === 'no')
                .map(([attributeId, attributeValue]) => {
                  const attribute = attributes.find((attr) => String(attr.id) === attributeId)
                  if (!attribute) return null
                  const valueInfo = attributeOptions.find((option) => option.value === attributeValue)
                  const prefix = valueInfo?.prefix ?? transformCase(attributeValue, 'title')
                  return (
                    <ServiceFiltersPill
                      text={`${prefix}: ${attribute.title}`}
                      searchParamName={`attr-${attributeId}`}
                      searchParamValue={attributeValue}
                    />
                  )
                })}
          </div>
        )
      }

      <Button
        as="label"
        for="show-filters"
        label="Filters"
        icon="ri:filter-3-line"
        class="max-2xs:w-9 max-2xs:px-0"
        classNames={{
          label: 'max-2xs:hidden',
        }}
      />
    </div>

    <input
      type="checkbox"
      id="show-filters"
      name="show-filters"
      class="peer sr-only sm:hidden"
      checked={Astro.url.searchParams.has('show-filters')}
    />
    <div
      class="bg-night-700 fixed top-0 left-0 z-50 hidden h-dvh w-dvw shrink-0 translate-y-full overflow-y-auto overscroll-contain border-t border-green-500/30 px-8 pt-4 transition-transform peer-checked:translate-y-0 max-sm:peer-checked:block sm:relative sm:z-auto sm:block sm:h-auto sm:w-64 sm:translate-y-0 sm:overflow-visible sm:border-none sm:bg-none sm:p-0"
    >
      <ServicesFilters
        searchResultsId={searchResultsId}
        showFiltersId={showFiltersId}
        filters={{
          ...filters,
          'sort-seed': makeSortSeed(),
        }}
        options={filtersOptions}
        hasDefaultFilters={hasDefaultFilters}
      />
    </div>

    <ServicesSearchResults
      services={services}
      id="search-results"
      currentPage={filters.page}
      total={totalServices}
      pageSize={PAGE_SIZE}
      sortSeed={filters['sort-seed']}
      filters={filters}
      countCommunityOnly={countCommunityOnly}
      inlineIcons
    />
  </div>
  {
    totalServices > PAGE_SIZE && (
      <Pagination
        currentPage={filters.page}
        totalPages={Math.ceil(totalServices / PAGE_SIZE)}
        sortSeed={filters['sort-seed']}
        class="js:hidden mt-8"
      />
    )
  }
</BaseLayout>

<script>
  ////////////////////////////////////////////////////////////
  // Optional script for removing sort-seed from URL.       //
  // This helps keep URLs cleaner when sharing.             //
  ////////////////////////////////////////////////////////////

  import { addOnLoadEventListener } from '../lib/onload'

  addOnLoadEventListener(() => {
    const url = new URL(window.location.href)
    if (url.searchParams.has('sort-seed')) {
      url.searchParams.delete('sort-seed')
      window.history.replaceState({}, '', url)
    }
  })
</script>