Refactor to use dynamic sponsor links

www/docs/src/components/Sponsors.astro

@@ -1,10 +1,11 @@
 ---
+import s from '~/share-link';
 ---
 
 <div class="sponsors">
 	<span class="sponsors-title">Sponsored By</span>
 	<a
-		href="https://turso.tech"
+		href={s.turso.docs.sidebarSponsorLink}
 		aria-label="Turso Tech"
 		target="_blank" 
 		rel="sponsored"

www/docs/src/content/docs/start-here/getting-started.mdx

@@ -12,6 +12,7 @@ import PackageManagers from '~/components/PackageManagers.astro';
 import TursoCLI from '~/components/TursoCLI.astro';
 import { Aside, Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import ReadMore from '~/components/ReadMore.astro';
+import { sponsors, SponsorLink } from '~/share-link'
 
 ## Let's get started
 
@@ -30,8 +31,8 @@ StudioCMS uses `@astrojs/db` to connect to your libSQL database. You can use any
 ### Getting started with Turso
 
 <Steps>
-1. Install the [Turso CLI](https://docs.turso.tech/cli/installation)
-2. [Login or signup](https://docs.turso.tech/cli/authentication) to Turso.
+1. Install the <SponsorLink href={sponsors.turso.docs.installCLILink} text='Turso CLI'/>
+2. <SponsorLink href={sponsors.turso.docs.loginsignupLink} text='Login or signup'/> to Turso.
 3. Create a new database.
    <TursoCLI tursoCli='db' type='create' arg='studiocms' />
 4. Get and Set `ASTRO_DB_REMOTE_URL`

www/docs/src/share-link.ts

@@ -0,0 +1,7 @@
+import sponsors from '../../shared-config/sponsors';
+
+export { default as SponsorLink } from './util/SponsorLink.astro';
+
+export { sponsors };
+
+export default sponsors;

www/docs/src/util/SponsorLink.astro

@@ -0,0 +1,8 @@
+---
+interface Props {
+	text: string;
+	href: string | URL;
+}
+const { text, href } = Astro.props;
+---
+<a {href} aria-label={text} target="_blank" rel="noopener sponsored">{text} ⤴</a>

www/shared-config/sponsors.ts

@@ -0,0 +1,16 @@
+// This file is used to define the sponsors and their respective urls.
+export const sponsors = {
+	turso: {
+		docs: {
+			sidebarSponsorLink: 'https://turso.tech',
+			installCLILink: 'https://docs.turso.tech/cli/installation',
+			loginsignupLink: 'https://docs.turso.tech/cli/authentication',
+		},
+		web: {
+			sponsorLink: 'https://turso.tech',
+		},
+		// TODO: Add Turso specific links when they are provided to us.
+		// Also, switch to utilizing these new links within the websites.
+	},
+};
+export default sponsors;

www/web/src/pages/index.astro

@@ -9,6 +9,7 @@ import Separator from '../components/Separator.astro';
 // import TestimonialCard from '../components/TestimonialCard.astro';
 import { GITHUB_URL, SPONSOR_URL } from '../constants';
 import BaseLayout from '../layouts/BaseLayout.astro';
+import sponsors from '../share-link';
 
 const features = (await getCollection('features')).sort(
 	({ data: { sortOrder: a } }, { data: { sortOrder: b } }) => a - b
@@ -35,7 +36,7 @@ const features = (await getCollection('features')).sort(
   <section class='studiocms-container mx-auto px-8 py-10 relative -translate-y-20 md:-translate-y-32'>
     <h3 class='text-center text-3xl font-semibold block'>Sponsored by</h3>
     <div class='flex flex-row flex-wrap align-center justify-center mb-12 relative'>
-      <a href="https://turso.tech/" target="_blank" rel="sponsored">
+      <a href={sponsors.turso.web.sponsorLink} target="_blank" rel="sponsored">
         <Image src={'/sponsors/turso.svg'} alt={'Turso Logo'} width={410} height={120} class='dark:block hidden' loading={'eager'} />
         <Image src={'/sponsors/turso-dark.svg'} alt={'Turso Logo'} width={410} height={120} class='block dark:hidden' loading={'eager'} />
       </a>

www/web/src/share-link.ts

@@ -0,0 +1,5 @@
+import sponsors from '../../shared-config/sponsors';
+
+export { sponsors };
+
+export default sponsors;