Implement like heart feature and AI feedback context by SeunFashina002 · Pull Request #26 · TopFlight-Digital/optipilot

SeunFashina002 · 2025-06-18T12:39:49Z

🚀 Feature: Like Heart & AI Feedback Context

Summary

This PR implements the "like heart" feature for hypotheses (A/B test ideas) and enhances idea generation by sending liked ideas as context to the AI, as outlined in the project roadmap.

What’s Included

Like Heart Feature:
- Users can mark their favorite hypotheses with a heart icon.
- Liked ideas are persisted in localStorage and remain visible after re-scans or feedback.
AI Feedback Context:
- When generating new ideas or sending feedback, all liked ideas are sent to the backend.
- The backend includes these liked ideas in the prompt to the AI, so new suggestions are more tailored to user preferences.
Robustness:
- Defensive checks to prevent runtime errors if localStorage is corrupted or missing.
- TypeScript and linter fixes related to the new feature.

How It Works

Users can like/unlike any hypothesis card.
Liked ideas persist across sessions and re-scans.
When the user requests new ideas or gives feedback, their liked ideas are included in the AI prompt for more relevant suggestions.

Why This Matters

Personalizes the user experience by letting users influence future suggestions.
Aligns with the roadmap for improved idea generation and user engagement.

Notes

This PR only changes what’s necessary for the feature and related bug fixes.
Other unrelated linter/type issues are left for future PRs.

v1olen

I've found so nice-to-fix bits, reckon there's a few more things that would be good to tweak but the formatter thing (I've mentioned in the comment) make it harder to review. Would be nice if you could get rid of this formatting changes so I can do a second round later :)

v1olen · 2025-06-20T07:41:26Z

backend/prompt/hypotheses-prompt.ts

    title: string;
    description: string;
-}
+};


It seems that you have some extra linter (like prettier or sth else) enabled, could you disable it for this project? There's a lot of formatting changes in this PR that will probably get reverted when other person will work on these files; it'll lead to battle of linters leaving post-battle wrecks in every PR 😄

We use eslint for code formatting (planning to migrate to stylistic in the future), feel free to run it from cli on the entire codebase at the very end and keep in a separate commit, then just enable it in your IDE

v1olen · 2025-06-20T07:44:05Z

backend/package-lock.json

@@ -0,0 +1,2900 @@
+{


We generally use pnpm, rather than npm. Let's don't keep two types of lock files in the codebase

v1olen · 2025-06-20T07:50:05Z

vite.config.ts

 export default defineConfig({
    define: {
-        API_SERVER_URL: JSON.stringify(``),
+        API_SERVER_URL: JSON.stringify(`http://localhost:4000`),


Would be good to finally split it to .env file, but up to you, we can also do it later

v1olen · 2025-06-20T07:51:29Z

src/components/bloc/hypothesis/hypothesis.vue

+            <svg
+                v-if="props.liked"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                fill="white"
+                xmlns="http://www.w3.org/2000/svg"
+            >
+                <path
+                    d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41 0.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"
+                />
+            </svg>
+            <svg
+                v-else
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="white"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                xmlns="http://www.w3.org/2000/svg"
+            >
+                <path
+                    d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41 0.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"
+                />
+            </svg>


Please move the icon to a separate component

v1olen · 2025-06-20T07:52:40Z

src/views/hypotheses/index.vue

                            :index="index + 1"
                            :title="item.title"
                            :subtitle="item.description"
+                            :liked="isLiked(item.title)"


I don't remember atm but don't we have any more suitable field to identify a single hypothesis by?

v1olen · 2025-06-20T07:55:38Z

src/views/hypotheses/index.vue

+        // If currently liked, remove from Map (unlike)
+        likedHypotheses.value.delete(title);
+    } else {
+        // If not liked, set to true (like)


Don't you think this code here is pretty self-explanatory? We usually stick to a rule that "comments are apologies", while this piece of code doesn't need to apologise, these comment seem to be typical this-is-a-stop-sign comments 😄

v1olen · 2025-06-20T07:56:46Z

src/views/hypotheses/index.vue

+            read: (v) => new Map(JSON.parse(v || "[]")),
+            write: (v) => JSON.stringify(Array.from(v.entries())),


We usually try to not use single letters to name variables

v1olen · 2025-06-20T07:57:32Z

src/views/hypotheses/index.vue

+);
+
+function isLiked(title: string) {
+    return likedHypotheses.value.get(title) === true;


Suggested change

return likedHypotheses.value.get(title) === true;

return likedHypotheses.value.get(title);

v1olen · 2025-06-20T07:58:18Z

src/composables/bloc.ts

+            const prev = (bloc.hypotheses || []).find(
+                (h: Hypothesis) => h.title === title,
+            );


We usually try to not use single letters or abbrs to name variables

v1olen · 2025-06-20T08:01:11Z

src/composables/bloc.ts

+    const missingLiked = (
+        JSON.parse(localStorage.getItem("liked.hypotheses") || "[]") as [
+            string,
+            boolean,
+        ][]
+    )
+        .filter(
+            ([title, liked]) =>
+                liked && !results.some((h: Hypothesis) => h.title === title),
+        )
+        .map(([title]) => {
+            // Try to find the last known version in previous hypotheses
+            const prev = (bloc.hypotheses || []).find(
+                (h: Hypothesis) => h.title === title,
+            );
+            return prev || { title, description: "(Previously liked idea)" };
+        });


Even though it's possible to understand, would be good to decrease a cognitive load needed to do so 😄

Could you replace it with an easy-to-read procedural logic based on for..of loop?

SeunFashina002 · 2025-06-20T08:14:37Z

Saw a comment @v1olen where you asked if the pr contains generation of tailors ideas based on the liked idea. I can't find the comment again, but yeah, it does.

…

On Fri, Jun 20, 2025, 9:07 AM v1olen ***@***.***> wrote: *v1olen* left a comment (TopFlight-Digital/optipilot#26) <#26 (comment)> Also, one question, following-up the roadmap task: Include a “like heart feature” where users can mark their favourite ideas. When the user then gives feedback and performs a re-scan, these ideas will persist in the list and perhaps generate more tailored ideas based on the “liked ideas”. the PR doesn't implement the perhaps generate more tailored ideas based on the “liked ideas” part right? That's totally okay if not just let me know so we will split this feature into two separate ones — Reply to this email directly, view it on GitHub <#26 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AWDUZXLFUEPR7FDZXPEEW7D3EO6NLAVCNFSM6AAAAAB7S73ZRCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDSOJQGIYDIMBTGI> . You are receiving this because you authored the thread.Message ID: ***@***.***>

v1olen · 2025-06-20T08:25:28Z

Saw a comment @v1olen where you asked if the pr contains generation of tailors ideas based on the liked idea. I can't find the comment again, but yeah, it does.

Yea, I see, I missed that and therefore removed the comment. All good, thanks :)

SeunFashina002 · 2025-06-20T08:27:42Z

Will work on all the changes you mentioned @v1olen , and yeah, I will get rid of that formatter 😅. Sorry about that!

SeunFashina002 · 2025-06-23T14:32:12Z

@v1olen I've made changes to the code blocks you highlighted. As for the formatter, I've disabled prettier and I tried using lint:fix to force my code to follow the rules specified in the .eslintrc file before pushing this time. Does that help in any way to review smoothly?

v1olen requested changes Jun 20, 2025

View reviewed changes

feat: add like feature for hypotheses with proper formatting

e8d6e61

SeunFashina002 force-pushed the feature/like-heart-ai-feedback branch from d06e7ad to e8d6e61 Compare June 23, 2025 11:52

SeunFashina002 added 5 commits June 23, 2025 15:14

modify logic and remove abbrv and single letters

438031d

refactored svg to component

82f1b08

remove unnecessary condition

2727742

additional fixes from review

68579df

fix version differences

24a02d7

		read: (v) => new Map(JSON.parse(v \|\| "[]")),
		write: (v) => JSON.stringify(Array.from(v.entries())),

	return likedHypotheses.value.get(title) === true;
	return likedHypotheses.value.get(title);

Conversation

SeunFashina002 commented Jun 18, 2025

🚀 Feature: Like Heart & AI Feedback Context

Summary

What’s Included

How It Works

Why This Matters

Notes

Uh oh!

v1olen left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

v1olen Jun 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

SeunFashina002 commented Jun 20, 2025 via email • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

v1olen commented Jun 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

SeunFashina002 commented Jun 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

SeunFashina002 commented Jun 23, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

v1olen Jun 20, 2025 •

edited

Loading

SeunFashina002 commented Jun 20, 2025 via email •

edited

Loading

v1olen commented Jun 20, 2025 •

edited

Loading

SeunFashina002 commented Jun 20, 2025 •

edited

Loading