fixed the partner wishlist tutorial flow bug

[tifpham021]

Description

Resolves ticket number: #ticket wasn't made

Explain what your code changes:

• fixed ui bug for the wishlist tutorial flow
• able to go to previous steps smoothly in wishlist flow
• added code so that tutorial only shows up once for users and not every time screen is refreshed

List the steps you took to test your code:

• made sure tutorial flow worked smoothly

Checklist

• The ticket is mentioned above
• The changes fulfill the success criteria of the ticket
• The changes were self-reviewed
• A review was requested

[netlify]

✅ Deploy Preview for hope-for-haiti ready!

Name	Link
🔨 Latest commit	5f628d1
🔍 Latest deploy log	https://app.netlify.com/projects/hope-for-haiti/deploys/69dbf0fa9c68bd0008e59047
😎 Deploy Preview	https://deploy-preview-340--hope-for-haiti.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[greptile-apps]

Greptile Summary

This PR fixes three related bugs in the partner wishlist tutorial flow: tutorial targets that failed to resolve because DOM elements were conditionally rendered, broken "Back" navigation between steps, and the tutorial re-appearing on every page refresh because server-side completion status was not checked before launch.

Checklist areas needing improvement (score: 82/100):

• Unused code: data-tutorial=\"wishlist-title-field\" (outer wrapper in AddToWishlistModal.tsx) is never referenced by any tutorial step and should be removed.
• Edge-case resilience: The new isCompletionSynced gate in Tutorial.tsx has a narrow race window — if a session update cancels the in-flight completion fetch before a response arrives, the flag stays false and the tutorial never starts for that session.

Confidence Score: 5/5

Safe to merge — all findings are P2 (style/edge-case) and do not block core functionality.

The three bugs addressed are real and the fixes are correct: always-present tutorial targets, step navigation, and the once-only guard via isCompletionSynced. The two remaining concerns (unused attribute, narrow cancellation race) are cosmetic or low-probability and don't affect the happy path.

src/components/Tutorial.tsx — the isCompletionSynced cancellation edge case is worth a follow-up hardening.

Important Files Changed

Filename	Overview
src/components/Tutorial.tsx	Adds isCompletionSynced gate so the tutorial won't launch before the server-side completion status is known; a narrow cancellation race on the initial fetch could leave the flag permanently false.
src/components/AddToWishlistModal.tsx	Restructures step-1 DOM to always render the wishlist-suggestions container and expose stable data-tutorial targets; the wishlist-title-field attribute is unused.
src/screens/Wishlist/PartnerWishlistScreen.tsx	Updates tutorial step targets to match renamed DOM attributes and adds isFixed: true to steps anchored inside the fixed-position modal; changes are correct.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A([Component mounts]) --> B{user?.id exists?}
    B -- No --> C[setIsCompletionSynced true]
    B -- Yes --> D{hasFetchedCompletionRef?}
    D -- true --> E[Return early - no isCompletionSynced change]
    D -- false --> F[Set hasFetchedCompletionRef = true - Fetch API]
    F --> G{Response ok?}
    G -- Error --> H[setServerTutorialCompleted + setIsCompletionSynced true]
    G -- Yes --> I{latestValue is boolean?}
    I -- No --> H
    I -- Yes --> J[setServerTutorialCompleted latestValue]
    J --> K{latestValue differs from session?}
    K -- Yes --> L[await updateSession]
    K -- No --> M[setIsCompletionSynced true]
    L --> M
    H --> N{isCompletionSynced AND NOT isTutorialCompleted?}
    M --> N
    C --> N
    N -- No --> O([Tutorial returns null])
    N -- Yes --> P([Tutorial starts Joyride])

Loading

_{Reviews (1): Last reviewed commit: "fixed the partner wishlist tutorial flow..." | Re-trigger Greptile}

[ND68]

fix works well, nice work