Merge branch 'main' of github.com:pockethost/pockethost

packages/dashboard/src/components/Testimonials.svelte

@@ -0,0 +1,74 @@
+<script lang="ts">
+  import { faStar } from '@fortawesome/free-solid-svg-icons'
+  import Fa from 'svelte-fa'
+
+  const testimonials = [
+    {
+      name: 'Riddge Mussington',
+      title: '',
+      quote:
+        "I use pockethost for a couple projects and I think you would be hard pressed to find a better hosted provider for pocketbase projects. It is very easy to use and setup and secure by default because it uses pocketbase under the hood, it's also very fast at shipping pocketbase updates and maintaining uptime and fixing issues, it's truly a god chosen database especially with the very generous free tier that I wish will never change, I'm currently building my next side hustle with it so I can't wait for it to grow larger",
+    },
+    {
+      name: 'H.Mohamed',
+      title: '',
+      quote: 'Great BaaS option for simpler apps with a generous free plan.',
+    },
+    {
+      name: 'Damian Kennedy',
+      title: 'Building AIAutomations',
+      quote: `Brilliant convenient for rapid serverless data store in combo with Vercel. Don't need the costly Postgres or upstash setup`,
+    },
+    {
+      name: 'Olivier Mills',
+      title: 'Web developer, idea maker',
+      quote: 'Amazing tool for fast deploy!',
+    },
+    {
+      name: 'Stephane Roux',
+      title: 'Altar JS founder',
+      quote: 'Absolutely amazing. Building web applications just got better.',
+    },
+    {
+      name: 'Giovanni Cruz',
+      title: 'Software developer',
+      quote:
+        'Been inlove with this from the first moment I used it. Excellent offering.',
+    },
+    {
+      name: 'Anele Mbanga',
+      title: 'Software Engineer, Explorer, Inventor',
+      quote: 'Very simple, effective, and generous!',
+    },
+    {
+      name: 'Saif-Alislam Dekna',
+      title: 'A Dreamer, young pilot, and entrepreneur',
+      quote: '',
+    },
+  ]
+</script>
+
+<div class="flex flex-wrap justify-center gap-4">
+  {#each testimonials as testimonial}
+    <div class="card bg-neutral shadow-xl w-96">
+      <div class="card-body">
+        <div class="flex mb-2">
+          <Fa icon={faStar} class="text-warning" />
+          <Fa icon={faStar} class="text-warning" />
+          <Fa icon={faStar} class="text-warning" />
+          <Fa icon={faStar} class="text-warning" />
+          <Fa icon={faStar} class="text-warning" />
+        </div>
+        <p class="mb-4">{testimonial.quote}</p>
+        <div class="card-actions">
+          <div>
+            <p class="font-bold">{testimonial.name}</p>
+            {#if testimonial.title}
+              <p class="text-sm opacity-75">{testimonial.title}</p>
+            {/if}
+          </div>
+        </div>
+      </div>
+    </div>
+  {/each}
+</div>

packages/dashboard/src/routes/(static)/pricing/+page.svelte

@@ -4,6 +4,7 @@
   import PricingTable from './PricingTable.svelte'
   import { userStore } from '$util/stores'
   import FlounderCard from '$src/routes/(app)/account/FlounderCard.svelte'
+  import Testimonials from '$src/components/Testimonials.svelte'
 </script>
 
 <!-- Flex them up -->
@@ -46,4 +47,5 @@
   </div>
 
   <PricingTable />
+  <Testimonials />
 </div>

packages/dashboard/src/util/stores.ts

@@ -96,12 +96,14 @@ export const init = () => {
   onAuthChange((authStoreProps) => {
     const isLoggedIn = authStoreProps.isValid
     isUserLoggedIn.set(isLoggedIn)
-    userStore.set(isLoggedIn ? (authStoreProps.model as UserFields) : undefined)
+    const user = authStoreProps.model as UserFields
+    userStore.set(isLoggedIn ? user : undefined)
     isAuthStateInitialized.set(true)
+    tryUserSubscribe(user?.id)
   })
 
   userStore.subscribe((user) => {
-    console.log({ user })
+    console.log(`userStore.subscribe`, { user })
     isUserPaid.set(
       [
         SubscriptionType.Founder,
@@ -157,3 +159,31 @@ export const init = () => {
     tryInstanceSubscribe()
   })
 }
+
+const tryUserSubscribe = (() => {
+  let unsub: UnsubscribeFunc | undefined
+  let tid: NodeJS.Timeout | undefined
+
+  const _trySubscribe = (id?: string) => {
+    clearTimeout(tid)
+    unsub?.()
+    unsub = undefined
+    if (!id) return
+    console.log('Subscribing to user', id)
+    client()
+      .client.collection('users')
+      .subscribe<UserFields>(id, (data) => {
+        console.log('User subscribed update', data)
+        userStore.set(data.record)
+      })
+      .then((u) => {
+        unsub = u
+      })
+      .catch(() => {
+        console.error('Failed to subscribe to user')
+        tid = setTimeout(_trySubscribe, 1000)
+      })
+  }
+
+  return _trySubscribe
+})()