From 401018e4e2595a7571f4e61756585090ac161d4c Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Thu, 30 Jan 2025 17:25:01 -0800
Subject: [PATCH 1/2] Added new testimony, testimonies now display in a random
 order.

---
 app/components/Testimonies.vue | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/app/components/Testimonies.vue b/app/components/Testimonies.vue
index 90b0192..19ce7e2 100644
--- a/app/components/Testimonies.vue
+++ b/app/components/Testimonies.vue
@@ -33,7 +33,7 @@
           }
         }"
       >
-        <swiper-slide v-for="t in testimonies" :key="t.author">
+        <swiper-slide v-for="t in randomizedOrder" :key="t.author">
           <div
             class="light:border-black/20 light:bg-gray-700/10 flex h-[300px] flex-col rounded-lg border border-white/20 bg-gray-500/10 p-4 text-foreground backdrop-blur-lg lg:px-5 lg:py-6"
           >
@@ -64,6 +64,10 @@
     return `"${quote}"`;
   }
 
+  const randomizedOrder = computed(() => {
+    return [...testimonies].sort(() => Math.random() - 0.5);
+  });
+
   const testimonies: Testimony[] = [
     {
       author: "Kai",
@@ -89,5 +93,11 @@
       quote:
         "Cider completely changes the game for the desktop Apple Music experience. Gone are the blindingly ugly light mode of iTunes and the awful performance on official clients, replaced by an <b>absolute</b> beauty that zips around like a supercar. I for one welcome our new music overlords.",
     },
+    {
+      author: "RylanFM",
+      position: "New Cider Enthusiast",
+      quote:
+        "I was a bit skeptical having never even heard of Cider until the afternoon I got it. A couple weeks in and I can confidently say that this is one of the best purchases I have ever made. The UI is so clean and intuitive. I have a vertical monitor and immersive mode looks amazing. Everyone in the Discord server was so kind and helped me get it set up in just a few minutes. I highly recommend giving Cider a try!",
+    }
   ];
 </script>

From 2d60a33be8d3014c1c2f6d6e6d50e16b4b84142e Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Thu, 30 Jan 2025 17:45:54 -0800
Subject: [PATCH 2/2] Fix randomization

---
 app/components/Testimonies.vue | 127 +++++++++++++++++----------------
 1 file changed, 67 insertions(+), 60 deletions(-)

diff --git a/app/components/Testimonies.vue b/app/components/Testimonies.vue
index 19ce7e2..ba27617 100644
--- a/app/components/Testimonies.vue
+++ b/app/components/Testimonies.vue
@@ -1,7 +1,5 @@
 <template>
-  <UiContainer
-    class="relative flex flex-col items-start justify-center gap-10 gap-y-12 py-10 lg:h-[550px] lg:flex-row"
-  >
+  <UiContainer class="relative flex flex-col items-start justify-center gap-10 gap-y-12 py-10 lg:h-[550px] lg:flex-row">
     <div class="absolute bottom-5 right-[50%] hidden lg:block">
       <div class="h-[300px] w-[300px]">
         <NuxtImg src="/fancy-arrow.svg" />
@@ -13,7 +11,7 @@
         <p class="mt-10 text-xl text-muted-foreground lg:mr-20">
           Cider is the go-to choice for thousands of talented individuals (<kbd>{{
             memberCount
-          }}</kbd>
+            }}</kbd>
           to be exact) like you! Our vibrant community is at the heart of everything we do. See what
           some of our satisfied users have to say...
         </p>
@@ -33,71 +31,80 @@
           }
         }"
       >
-        <swiper-slide v-for="t in randomizedOrder" :key="t.author">
-          <div
-            class="light:border-black/20 light:bg-gray-700/10 flex h-[300px] flex-col rounded-lg border border-white/20 bg-gray-500/10 p-4 text-foreground backdrop-blur-lg lg:px-5 lg:py-6"
-          >
-            <div class="mb-5 inline-flex grow text-xl">
-              <p class="italic" v-html="addQuotes(t.quote)" />
+        <template
+          v-for="(t, index) in testimonies"
+          :key="index"
+        >
+          <swiper-slide>
+            <div
+              class="light:border-black/20 light:bg-gray-700/10 flex h-[300px] flex-col rounded-lg border border-white/20 bg-gray-500/10 p-4 text-foreground backdrop-blur-lg lg:px-5 lg:py-6"
+            >
+              <div class="mb-5 inline-flex grow text-xl">
+                <p
+                  class="italic"
+                  v-html="addQuotes(t.quote)"
+                />
+              </div>
+              <div class="inset-x-0 bottom-0 mt-2">
+                <p class="w-100 text-xl font-semibold">{{ t.author }}</p>
+                <p>{{ t.position }}</p>
+              </div>
             </div>
-            <div class="inset-x-0 bottom-0 mt-2">
-              <p class="w-100 text-xl font-semibold">{{ t.author }}</p>
-              <p>{{ t.position }}</p>
-            </div>
-          </div>
-        </swiper-slide>
+          </swiper-slide>
+        </template>
       </swiper-container>
     </div>
   </UiContainer>
 </template>
 
 <script setup lang="ts">
-  type Testimony = {
-    author: string;
-    position: string;
-    quote: string;
-  };
+type Testimony = {
+  author: string;
+  position: string;
+  quote: string;
+};
 
-  const memberCount = ref("13,567");
+const memberCount = ref("13,567");
 
-  function addQuotes(quote: string) {
-    return `"${quote}"`;
-  }
+function addQuotes(quote: string) {
+  return `"${quote}"`;
+}
 
-  const randomizedOrder = computed(() => {
-    return [...testimonies].sort(() => Math.random() - 0.5);
-  });
 
-  const testimonies: Testimony[] = [
-    {
-      author: "Kai",
-      position: "Proud Cider User",
-      quote:
-        "After making the switch to Apple Music mid-2022, a Windows music client was all I needed to solidify the switch. Cider brings that and more to the table, with integrations for Last.fm, Spotify, and Discord, making it THE definitive music client for chronically online peeps.",
-    },
-    {
-      author: "Bjorn",
-      position: "Apple Enthusiast",
-      quote:
-        "I'm a huge believer in trying a product before paying for it. I have to say, this is 100% worth $3.99 to play Apple Music. This does exactly what you need, is extremely smooth and not full of bloatware. Recommend this for anyone who is sick of iTunes, but loves Apple Music on their iPhone.",
-    },
-    {
-      author: "Daniel",
-      position: "Cider User",
-      quote:
-        "The only real drawback to Apple Music for me was the lack of a decent app for Windows. This seems to be a godsend for Window users. About 3 minutes into the trial period I knew this was the solution I was hoping for.",
-    },
-    {
-      author: "SoNothing",
-      position: "UI Enthusiast (aka Nit-picker)",
-      quote:
-        "Cider completely changes the game for the desktop Apple Music experience. Gone are the blindingly ugly light mode of iTunes and the awful performance on official clients, replaced by an <b>absolute</b> beauty that zips around like a supercar. I for one welcome our new music overlords.",
-    },
-    {
-      author: "RylanFM",
-      position: "New Cider Enthusiast",
-      quote:
-        "I was a bit skeptical having never even heard of Cider until the afternoon I got it. A couple weeks in and I can confidently say that this is one of the best purchases I have ever made. The UI is so clean and intuitive. I have a vertical monitor and immersive mode looks amazing. Everyone in the Discord server was so kind and helped me get it set up in just a few minutes. I highly recommend giving Cider a try!",
-    }
-  ];
+const testimonies = ref<Testimony[]>([
+  {
+    author: "Kai",
+    position: "Proud Cider User",
+    quote:
+      "After making the switch to Apple Music mid-2022, a Windows music client was all I needed to solidify the switch. Cider brings that and more to the table, with integrations for Last.fm, Spotify, and Discord, making it THE definitive music client for chronically online peeps.",
+  },
+  {
+    author: "Bjorn",
+    position: "Apple Enthusiast",
+    quote:
+      "I'm a huge believer in trying a product before paying for it. I have to say, this is 100% worth $3.99 to play Apple Music. This does exactly what you need, is extremely smooth and not full of bloatware. Recommend this for anyone who is sick of iTunes, but loves Apple Music on their iPhone.",
+  },
+  {
+    author: "Daniel",
+    position: "Cider User",
+    quote:
+      "The only real drawback to Apple Music for me was the lack of a decent app for Windows. This seems to be a godsend for Window users. About 3 minutes into the trial period I knew this was the solution I was hoping for.",
+  },
+  {
+    author: "SoNothing",
+    position: "UI Enthusiast (aka Nit-picker)",
+    quote:
+      "Cider completely changes the game for the desktop Apple Music experience. Gone are the blindingly ugly light mode of iTunes and the awful performance on official clients, replaced by an <b>absolute</b> beauty that zips around like a supercar. I for one welcome our new music overlords.",
+  },
+  {
+    author: "RylanFM",
+    position: "New Cider Enthusiast",
+    quote:
+      "I was a bit skeptical having never even heard of Cider until the afternoon I got it. A couple weeks in and I can confidently say that this is one of the best purchases I have ever made. The UI is so clean and intuitive. I have a vertical monitor and immersive mode looks amazing. Everyone in the Discord server was so kind and helped me get it set up in just a few minutes. I highly recommend giving Cider a try!",
+  }
+]);
+
+onMounted(() => {
+  testimonies.value = testimonies.value.sort(() => Math.random() - 0.5);
+})
 </script>