searchable

This commit is contained in:
Jesse Winton
2025-03-18 14:23:09 -04:00
parent b303423a23
commit c14cc55621
6 changed files with 36 additions and 26 deletions

View File

@@ -27,13 +27,13 @@ export type SocialShareOption = {
type: 'link' | 'copy';
};
export type IntegrationCategory = {
export type SearchableCategory = {
slug: string;
heading: string;
description: string;
};
export const integrationCategoryDescriptions: IntegrationCategory[] = [
export const integrationCategoryDescriptions: SearchableCategory[] = [
{
slug: 'ai',
heading: 'AI',
@@ -81,6 +81,14 @@ export const integrationCategoryDescriptions: IntegrationCategory[] = [
}
];
export const partnerCategoryDescriptions: SearchableCategory[] = [
{
slug: 'agency',
heading: 'Agency',
description: 'Agency description goes here'
}
];
export const socialSharingOptions: Array<SocialShareOption> = [
{
icon: 'web-icon-x',

View File

@@ -6,7 +6,7 @@
import { DEFAULT_HOST } from '$lib/utils/metadata';
import type { Integration } from '$routes/integrations/+page';
import { isHeaderHidden } from '$lib/layouts/Main.svelte';
import { integrationCategoryDescriptions } from '$lib/constants';
import { partnerCategoryDescriptions } from '$lib/constants';
export let title: Integration['title'];
export let images: Integration['images'];
@@ -20,7 +20,7 @@
//const title = 'Integrations' + TITLE_SUFFIX;
//const ogImage = DEFAULT_HOST + '/images/open-graph/website.png';
const ogImage = DEFAULT_HOST + cover;
const categoryHeading = integrationCategoryDescriptions.find(
const categoryHeading = partnerCategoryDescriptions.find(
(key) => key.slug === category.toLowerCase()
)?.heading;
</script>

View File

@@ -1,7 +1,7 @@
import { base } from '$app/paths';
import { groupBy } from 'remeda';
import type { IntegrationCategory } from '$lib/constants';
import { integrationCategoryDescriptions as categoryDescriptions } from '$lib/constants';
import type { SearchableCategory } from '$lib/constants';
import { partnerCategoryDescriptions as categoryDescriptions } from '$lib/constants';
export type Integration = {
title: string;
@@ -26,7 +26,7 @@ export const load = () => {
eager: true
});
const categories: IntegrationCategory[] = [];
const categories: SearchableCategory[] = [];
const platforms: string[] = [];
const integrations = Object.entries(integrationsGlob).map(([filepath, integrationList]) => {
@@ -40,7 +40,7 @@ export const load = () => {
frontmatter.platform.map((platform) => platforms.push(platform));
categories.push(
categoryDescriptions.find((i) => i.slug === frontmatter.category) ??
({} as IntegrationCategory)
({} as SearchableCategory)
);
return {

View File

@@ -143,10 +143,10 @@
goto(`#${e.currentTarget.value.toLowerCase()}`)}
>
{#each data.categories as category}
{@const integrations = data.integrations.find(
{@const integrations = data.partners.find(
(i) => i.category === category.slug
)}
{#if integrations && (activePlatform === 'All' || integrations.integrations.some( (i) => i.platform.includes(activePlatform) ))}
{#if integrations && (activePlatform === 'All' || integrations.integrations.some( (i) => i.partnerLevel.includes(activePlatform) ))}
<option value={category.slug}>
{category.heading}
</option>
@@ -162,10 +162,10 @@
<ul class="hidden flex-col gap-4 sm:flex" class:disabled={hasQuery}>
{#each data.categories as category}
{@const integrations = data.integrations.find(
{@const integrations = data.partners.find(
(i) => i.category === category.slug
)}
{#if integrations && (activePlatform === 'All' || integrations.integrations.some( (i) => i.platform.includes(activePlatform) ))}
{#if integrations && (activePlatform === 'All' || integrations.integrations.some( (i) => i.partnerLevel.includes(activePlatform) ))}
<li>
<a
href={`#${category.slug}`}
@@ -285,8 +285,8 @@
</div>
</section>
{#each data.integrations as { category, heading, description, integrations }}
{#if integrations?.length > 0 && (activePlatform === 'All' || integrations.some( (i) => i.platform.includes(activePlatform) ))}
{#each data.partners as { category, heading, description, integrations }}
{#if integrations?.length > 0 && (activePlatform === 'All' || integrations.some( (i) => i.partnerLevel.includes(activePlatform) ))}
<section
class="l-max-size-list-cards-section flex flex-col gap-8"
id={category.toLowerCase()}
@@ -312,7 +312,7 @@
<div class="l-max-size-list-cards flex flex-col gap-8">
<ul class="l-grid-1">
{#each integrations as integration, index (`${integration.title}-${index}`)}
{#if activePlatform === 'All' || integration.platform.includes(activePlatform)}
{#if activePlatform === 'All' || integration.partnerLevel.includes(activePlatform)}
<li>
<a
href={integration.href}

View File

@@ -1,7 +1,9 @@
import { base } from '$app/paths';
import { groupBy } from 'remeda';
import type { IntegrationCategory } from '$lib/constants';
import { integrationCategoryDescriptions as categoryDescriptions } from '$lib/constants';
import {
partnerCategoryDescriptions as categoryDescriptions,
type SearchableCategory
} from '$lib/constants';
export type Partner = {
title: string;
@@ -28,10 +30,10 @@ export const load = () => {
eager: true
});
const categories: IntegrationCategory[] = [];
const categories: Array<SearchableCategory> = [];
const platforms: string[] = [];
const integrations = Object.entries(partnersGlob).map(([filepath, integrationList]) => {
const partners = Object.entries(partnersGlob).map(([filepath, integrationList]) => {
const { frontmatter } = integrationList as {
frontmatter: Partner;
};
@@ -41,7 +43,7 @@ export const load = () => {
categories.push(
categoryDescriptions.find((i) => i.slug === frontmatter.category) ??
({} as IntegrationCategory)
({} as SearchableCategory)
);
return {
@@ -50,9 +52,9 @@ export const load = () => {
};
});
const groupedIntegrations = groupBy(integrations, (i) => i.category);
const groupedPartners = groupBy(partners, (i) => i.category);
const integrationsWithDescriptions = Object.entries(groupedIntegrations).map(
const partnersWithDescriptions = Object.entries(groupedPartners).map(
([category, integrations]) => {
const integrationCategory = categoryDescriptions.find(
(key) => key.slug === category.toLowerCase()
@@ -66,7 +68,7 @@ export const load = () => {
}
);
const featuredIntegrations = integrations.filter((i) => i.featured);
const featuredIntegrations = partners.filter((i) => i.featured);
const featuredIntegrationsWithCategoryHeadings = Object.entries(featuredIntegrations).map(
// eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -82,8 +84,8 @@ export const load = () => {
);
return {
integrations: integrationsWithDescriptions,
list: integrations,
partners: partnersWithDescriptions,
list: partners,
categories: new Set(categories),
platforms: new Set(platforms),
featured: featuredIntegrationsWithCategoryHeadings

View File

@@ -7,7 +7,7 @@ featured: true
partnerLevel: Platinum
isNew: true
cover: /images/integrations/ai-openai/cover.png
category: Agency
category: agency
website: partnername.com
product:
avatar: '/images/integrations/avatars/openai.png'