From 3fb4afd4fa5e5b624ec2b045d3868f4612adb7aa Mon Sep 17 00:00:00 2001
From: Marios Antonoudiou <mariosant@sent.com>
Date: Tue, 8 Apr 2025 18:38:07 +0300
Subject: [PATCH] Add tone support

---
 app/components/card-field.vue                 |  2 +-
 app/pages/index.vue                           | 17 +++++++++++++++-
 app/utils/languages.ts                        |  7 -------
 app/utils/model.ts                            | 20 +++++++++++++++++++
 server/api/preferences.put.ts                 |  1 +
 server/database/schema.ts                     |  4 +++-
 server/routes/auth/strava.ts                  |  3 ++-
 .../webhooks/strava/activity-create.post.ts   | 17 +++++++++-------
 8 files changed, 53 insertions(+), 18 deletions(-)
 delete mode 100644 app/utils/languages.ts
 create mode 100644 app/utils/model.ts

diff --git a/app/components/card-field.vue b/app/components/card-field.vue
index 0b81481..128a146 100644
--- a/app/components/card-field.vue
+++ b/app/components/card-field.vue
@@ -2,7 +2,7 @@
   <div class="flex justify-between items-center gap-4">
     <div>
       <div class="font-semibold"><slot name="title" /></div>
-      <div class="text-slate-600 text-sm">
+      <div class="text-slate-600 text-sm hidden md:block">
         <slot name="description" />
       </div>
     </div>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 04c9eeb..ca2d34b 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -13,9 +13,10 @@ interface FormData {
 const preferences = useState<FormData>("preferences", () => ({
   enabled: false,
   language: "English",
+  tone: "Casual",
 }));
 
-const { status, refresh } = useFetch("/api/preferences", {
+const { status } = useFetch("/api/preferences", {
   onResponse({ error, response }) {
     if (error) {
       return;
@@ -86,6 +87,20 @@ const saveOp = watchPausable(
             />
           </template>
         </CardField>
+
+        <CardField>
+          <template #title> Model tone </template>
+          <template #description>
+            Tone used for generated titles and descriptions.
+          </template>
+          <template #value>
+            <USelect
+              class="min-w-28"
+              v-model="preferences.tone"
+              :items="tones"
+            />
+          </template>
+        </CardField>
       </div>
     </UCard>
   </UContainer>
diff --git a/app/utils/languages.ts b/app/utils/languages.ts
deleted file mode 100644
index 0c6c044..0000000
--- a/app/utils/languages.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export const languages = ref([
-  "English",
-  "Greek",
-  "German",
-  "Italian",
-  "Polish",
-]);
diff --git a/app/utils/model.ts b/app/utils/model.ts
new file mode 100644
index 0000000..37a8a0e
--- /dev/null
+++ b/app/utils/model.ts
@@ -0,0 +1,20 @@
+export const languages = ref([
+  "English",
+  "Greek",
+  "German",
+  "Italian",
+  "Polish",
+]);
+
+export const tones = ref([
+  "Motivational",
+  "Casual",
+  "Funny",
+  "Epic",
+  "Minimalist",
+  "Reflective",
+  "Poetic",
+  "Competitive",
+  "Adventure",
+  "Snarky",
+]);
diff --git a/server/api/preferences.put.ts b/server/api/preferences.put.ts
index be402fc..738032b 100644
--- a/server/api/preferences.put.ts
+++ b/server/api/preferences.put.ts
@@ -9,6 +9,7 @@ export default defineEventHandler(async (event) => {
       data: {
         enabled: body.enabled,
         language: body.language,
+        tone: body.tone,
       },
     })
     .where(eq(tables.preferences.userId, session.user.id))
diff --git a/server/database/schema.ts b/server/database/schema.ts
index 1aea023..ffc1904 100644
--- a/server/database/schema.ts
+++ b/server/database/schema.ts
@@ -28,7 +28,7 @@ export const users = sqliteTable("users", {
   sex: text("sex"),
   weight: integer("weight"),
   createdAt: integer("created_at", { mode: "timestamp" }).$defaultFn(
-    () => new Date()
+    () => new Date(),
   ),
 });
 
@@ -43,10 +43,12 @@ export const preferences = sqliteTable("preferences", {
     .$type<{
       enabled: boolean;
       language: string;
+      tone: string;
     }>()
     .$defaultFn(() => ({
       enabled: true,
       language: "English",
+      tone: "Casual",
     })),
 });
 
diff --git a/server/routes/auth/strava.ts b/server/routes/auth/strava.ts
index c29b361..865c590 100644
--- a/server/routes/auth/strava.ts
+++ b/server/routes/auth/strava.ts
@@ -55,7 +55,8 @@ export default defineOAuthStravaEventHandler({
         userId: user.id,
         data: {
           enabled: true,
-          language: "english",
+          language: "English",
+          tone: "Casual",
         },
       })
       .onConflictDoNothing();
diff --git a/server/routes/webhooks/strava/activity-create.post.ts b/server/routes/webhooks/strava/activity-create.post.ts
index 319ff49..5885743 100644
--- a/server/routes/webhooks/strava/activity-create.post.ts
+++ b/server/routes/webhooks/strava/activity-create.post.ts
@@ -1,4 +1,4 @@
-import { get } from "radash";
+import { get, omit } from "radash";
 
 export default defineEventHandler(async (event) => {
   const body = await readBody(event);
@@ -19,9 +19,9 @@ export default defineEventHandler(async (event) => {
 
   const strava = await useStrava(body.owner_id);
 
-  const activity = await strava!(`/activities/${body.object_id}`);
+  const activity = (await strava!(`/activities/${body.object_id}`)) as any;
 
-  const aiResponse = await ai.run("@cf/meta/llama-3-8b-instruct", {
+  const aiResponse = await ai.run("@cf/meta/llama-3.1-8b-instruct", {
     response_format: {
       type: "json_schema",
       json_schema: {
@@ -34,20 +34,23 @@ export default defineEventHandler(async (event) => {
       },
     },
     prompt: `
-      Generate a title and a short description for my strava activity. Use my preferred language. Make sure to include emojis and make it fun.
+      Generate a title and a short description for my strava activity. Use my preferred language.
+      Use ${user?.preferences.data.tone} tone to generate content.
+      Add emojis unless tone is set to minimalist.
 
       My user profile:
       Sex: ${user?.sex}
-      City: ${user?.city}
-      Country: ${user?.country}
       Weight: ${user?.weight}
       Language: ${user?.preferences.data.language}
 
       The activity data in json format:
-      ${JSON.stringify(activity)}
+      ${JSON.stringify(omit(activity, ["map", "laps", "stats_visibility", "embed_token", "private_note"]))}
     `,
   });
 
+  // console.log(activity);
+  // console.log(aiResponse.response.title);
+  // console.log(aiResponse.response.description);
   await strava!(`activities/${body.object_id}`, {
     method: "PUT",
     body: {