diff --git a/common/src/socials.ts b/common/src/socials.ts index 5c5ba6d4..a939680f 100644 --- a/common/src/socials.ts +++ b/common/src/socials.ts @@ -15,6 +15,10 @@ export const SITE_ORDER = [ 'patreon', 'okcupid', 'calendly', + 'datingdoc', + 'friendshipdoc', + 'connectiondoc', + 'workdoc', 'spotify', ] as const @@ -44,6 +48,10 @@ const stripper: { [key in Site]: (input: string) => string } = { .replace(/\/$/, ''), okcupid: (s) => s.replace(/^(https?:\/\/)/, ''), calendly: (s) => s, + datingdoc: (s) => s, + friendshipdoc: (s) => s, + workdoc: (s) => s, + connectiondoc: (s) => s, bluesky: (s) => s .replace(/^(https?:\/\/)?(www\.)?bsky\.app\/profile\//, '') @@ -99,6 +107,10 @@ const urler: { [key in Site]: (handle: string) => string } = { paypal: (s) => `https://paypal.com/paypalme/${s}`, patreon: (s) => `https://patreon.com/${s}`, calendly: (s) => (s.startsWith('http') ? s : `https://${s}`), + datingdoc: (s) => (s.startsWith('http') ? s : `https://${s}`), + friendshipdoc: (s) => (s.startsWith('http') ? s : `https://${s}`), + workdoc: (s) => (s.startsWith('http') ? s : `https://${s}`), + connectiondoc: (s) => (s.startsWith('http') ? s : `https://${s}`), } export const PLATFORM_LABELS: { [key in Site]: string } = { @@ -117,4 +129,8 @@ export const PLATFORM_LABELS: { [key in Site]: string } = { patreon: 'Patreon', okcupid: 'OkCupid', calendly: 'Calendly', + datingdoc: 'Dating Doc', + friendshipdoc: 'Friendship Doc', + workdoc: 'Work Doc', + connectiondoc: 'Connection Doc', } diff --git a/web/components/user/social.tsx b/web/components/user/social.tsx index 9634a735..2d69a3a4 100644 --- a/web/components/user/social.tsx +++ b/web/components/user/social.tsx @@ -1,7 +1,7 @@ -import { LinkIcon } from '@heroicons/react/solid' -import { Site } from 'common/socials' -import { ReactNode } from 'react' -import { LuBookmark, LuHeart } from 'react-icons/lu' +import {DocumentReportIcon, LinkIcon} from '@heroicons/react/solid' +import {Site} from 'common/socials' +import {ReactNode} from 'react' +import {LuBookmark, LuHandshake, LuHeart, LuUsers} from 'react-icons/lu' import { TbBrandBluesky, TbBrandDiscord, @@ -34,6 +34,10 @@ export const PLATFORM_ICONS: { patreon: TbBrandPatreon, paypal: TbBrandPaypal, okcupid: LuHeart, + datingdoc: LuHeart, + friendshipdoc: LuUsers, + workdoc: DocumentReportIcon, + connectiondoc: LuHandshake, calendly: TbCalendar, } @@ -43,7 +47,7 @@ export const SocialIcon = (props: { size?: number; color?: string; }) => { - const { site, ...rest } = props + const {site, ...rest} = props const Icon = PLATFORM_ICONS[site as Site] || PLATFORM_ICONS.site return diff --git a/web/components/user/user-handles.tsx b/web/components/user/user-handles.tsx index ed64efe8..d397e33b 100644 --- a/web/components/user/user-handles.tsx +++ b/web/components/user/user-handles.tsx @@ -1,22 +1,26 @@ import {Row} from '../layout/row' import clsx from 'clsx' -import {getSocialUrl, SITE_ORDER, Socials} from 'common/socials' +import {getSocialUrl, PLATFORM_LABELS, Site, SITE_ORDER, Socials} from 'common/socials' import {sortBy} from 'lodash' import {SocialIcon} from './social' -const LABEL_TO_RENDER: Record = { - okcupid: 'OkCupid', - calendly: 'Calendly', -} +const LABELS_TO_RENDER = [ + 'okcupid', + 'calendly', + 'datingdoc', + 'friendshipdoc', + 'connectiondoc', + 'workdoc', +] export function UserHandles(props: { links: Socials; className?: string }) { const {links, className} = props const display = sortBy( Object.entries(links), - ([platform]) => -[...SITE_ORDER].reverse().indexOf(platform as any) + ([platform]) => -[...SITE_ORDER].reverse().indexOf(platform as Site) ).map(([platform, label]) => { - const renderedLabel = LABEL_TO_RENDER[platform] || label + const renderedLabel: string = LABELS_TO_RENDER.includes(platform) ? PLATFORM_LABELS[platform as Site] : label return { platform, label: renderedLabel,