Implement a Farcaster Frame for Sharing Logbook Entries

[johnx25bd]

Objective

MIGRATED to Logbook issue #40 !

Develop a Farcaster frame integration to allow users to seamlessly share their geotagged logbook entries to the Farcaster social network. This will extend the visibility of entries and provide a decentralized way for users to engage with their data.

---

Feature Description

1. User Flow:

   • Users can click a "Share to Farcaster" button on a Logbook entry, or simply paste the Log Entry Details URL.
   • The page includes tags that make it a shareable frame containing:
     • The logbook entry's photo(s).
     • A short memo or description text.
     • A preview of the map highlighting the geotagged location.
     • (Optional) Logbook branding or a link to the entry.

2. Frame Interactivity:

   • We're especially excited by ideas that take advantage of Farcaster Frames interactivity — we'd love ideas that gamify log entries, enable social verification that someone was present, etc. We're open-minded and would love to see creativity.

3. Frame Format:

   • Visual Design: A visually appealing template that highlights the core data while ensuring compatibility with Farcaster’s card-like post format.
   • Content Constraints: Complies with Farcaster’s character limits and image-sharing standards.

4. Integration:

   • Include the ability to post the generated frame directly via Farcaster's API (if available).
   • Alternatively, provide a "Copy Link" or "Download Frame" option for manual sharing.

---

Implementation Steps

1. Design the Frame Template

   • Create an HTML page that includes the required <meta> tags as specified in the Farcaster Frame Specification.
   • Ensure the frame includes:
     • fc:frame with the version string (e.g., vNext).
     • fc:frame:image pointing to the logbook entry's photo.
     • og:image as a fallback for clients not supporting frames.
   • Optionally, add interactive elements:
     • Buttons (fc:frame:button:$idx) for actions like "View on Map" or "Read More."
     • Define button actions (fc:frame:button:$idx:action) such as link or post_redirect.

2. Use logbook.astral.global as the Frame Server

   • We see our existing Logbook app as the Frame server — we believe Log Entry Details pages can be extended to serve as Farcaster Frames. Verify this, and if it's possible, implement the code to extend the page we already built.
   • Incorporate functionality to handle interactions:
     • Respond to POST requests from Farcaster clients when users interact with the frame.
     • Serve updated frames or redirect users based on interactions.
   • Ensure the server adheres to Farcaster's requirements:
     • Respond within 5 seconds to client requests.
     • Handle post and post_redirect actions appropriately.

3. Integrate Sharing Functionality in Logbook

   • Add a "Share to Farcaster" button on logbook entry pages.
   • On click, provide the Log Entry Details page URL for the frame corresponding to the entry.
   • Prompt the user to cast this URL on Farcaster, embedding the frame in their post.

4. Testing and Validation

   • Use the Frame Validator to ensure compliance with Farcaster's specifications.
   • Test the frame across different Farcaster clients to verify proper rendering and functionality.
   • Ensure that interactive elements work as intended and that the frame degrades gracefully in clients that do not support frames.

5. Documentation and Deployment

   • Document the sharing process for users, including steps to share entries to Farcaster.
   • Provide technical documentation for maintaining and updating the frame server.
   • Deploy the frame server and ensure it is accessible to Farcaster clients.

---

Acceptance Criteria

1. A "Share to Farcaster" button is present on each logbook entry page.
2. Clicking the button generates a Farcaster Frame URL specific to the entry.
3. Users can cast the URL on Farcaster, embedding the frame in their post.
4. The frame displays the entry's photo and includes interactive elements as designed.
5. The frame functions correctly across all Farcaster clients, with appropriate fallbacks for unsupported features.

---

Tagging: Frontend, Social Media Integration, Farcaster
Priority: Medium
Impact: High potential for user engagement and decentralized content sharing

---

[johnx25bd]

MIGRATED to Logbook issue #40