Project Vision & Goals

Relevant source files

The following files were used as context for generating this wiki page:

• README.md
• pages/api/dispatch.ts
• pages/index.tsx
• public/mails/email.html
• package.json
• components/success.tsx
• config/site.ts
• tests/api/dispatch.spec.ts

Heyme is a web application designed to provide individuals with a unique way to connect with their future selves. The core concept is to allow users to record and send video messages that will be delivered at a specified future date. This serves as a tool for motivation, reflection, and personal growth by creating a tangible link between one's past aspirations and future reality.

The project's primary goal is to facilitate an introspective exercise where users can articulate their values, priorities, and goals. By receiving these messages later, they are reminded of their journey, which can enhance self-awareness. The application is built with a modern tech stack centered around Next.js, with a clear focus on user experience and reliable message delivery.

Sources: README.md:6-15, pages/index.tsx:27-29, config/site.ts:10-11

Core Mission

The fundamental mission of Heyme is to empower users to "send messages to your future self." These messages are intended to be more than just simple reminders; they are envisioned as a "powerful source of motivation and a poignant reminder of their journey." The project aims to help individuals, whether they are pursuing personal or professional goals, to visualize their desired future and track their progress. This process is designed to cultivate a deeper understanding of one's own values and aspirations.

Sources: README.md:2-15

Key Features

The project outlines several key features that support its vision. These features combine user-facing functionality with backend processes to create the complete experience.

Feature	Description	Implementation Evidence -
Dark Mode	The application supports a dark theme for user comfort.	The next-themes package is listed as a dependency. The root HTML element is configured with className="dark", and a ThemeToggle component is present in the site header. Sources: package.json:44, pages/_document.tsx:4, components/site-header.tsx:39 -
Message Scheduling	Users can schedule messages to be delivered at a specific future date.	The pages/api/dispatch.ts script fetches videos where send_at matches the current date, indicating a scheduling mechanism is in place. Sources: README.md:22-23, pages/api/dispatch.ts:31-33 -
Customization	Users can send messages to themselves or to someone else.	The email dispatch logic checks if video.send_to === "yourself" to customize the email subject and greeting. Sources: README.md:24-25, pages/api/dispatch.ts:60, pages/api/dispatch.ts:71-74 -

• | Time Capsules | The project supports sending messages far into the future, such as 5, 10, or 20 years from now. | This is an extension of the scheduling feature. The architecture supports any future send_at date. Sources: README.md:26-28 - |
  | Social Sharing | Users are encouraged to share the application on social media platforms. | The success page includes share links for Facebook, LinkedIn, and Twitter, and uses the Web Share API if available. Sources: README.md:29-30, components/success.tsx:32-41 - |

Sources: README.md:21-30

System Architecture

The application is built on a service-oriented architecture that leverages several key technologies to deliver its functionality.

This diagram illustrates the main components of the Heyme application and their interactions.

The core components are:

1. Next.js Application: Serves as the primary framework for both the frontend UI (React components) and the backend API logic (API Routes).
2. MySQL: Used for persistent data storage, managed via knex. It stores information about the videos, including recipient email, send date, and status.
3. Zeptomail: A transactional email service used to send the scheduled video messages to users.
4. Web Media API / Web Media Recorder API: Browser APIs used on the client-side to record video and audio from the user's device.

Sources: README.md:41-45, package.json, pages/api/dispatch.ts

Core Functionality: Future Message Dispatch

A critical system for achieving the project's goal is the automated email dispatch mechanism. This is handled by the API endpoint at pages/api/dispatch.ts. This endpoint is designed to be run on a schedule (e.g., a daily cron job) to check for and send any messages due for delivery.

Dispatch Sequence

The following diagram shows the sequence of operations when the dispatch handler is invoked.

Key Functions

• fetchAllVideosForToday(connection): Queries the Videos table for all records where the send_at column matches the current date.
  Sources: pages/api/dispatch.ts:31-33
• updateVideoToSent(connection, id): After an email has been successfully dispatched, this function updates the corresponding record in the Videos table, setting the sent flag to 1 to prevent duplicate emails.
  Sources: pages/api/dispatch.ts:35-38
• getEmailContent({ watchLink, greeting, body, outro }): This function reads a static HTML template (public/mails/email.html) and dynamically replaces placeholders with content specific to the video message being sent. This ensures a personalized email for each user. The behavior of this function is verified by unit tests.
  Sources: pages/api/dispatch.ts:13-23, public/mails/email.html, tests/api/dispatch.spec.ts:6-23

Email Template

The email body is generated from a template with placeholders that are replaced at runtime.

Placeholders in public/mails/email.html:

• {{REPLACE_WATCH_LINK_HERE}}
• {{REPLACE_GREETING_HERE}}
• {{REPLACE_BODY_HERE}}
• {{REPLACE_OUTRO_HERE}}

These are populated by the getEmailContent function before being sent via Zeptomail.

Sources: public/mails/email.html, pages/api/dispatch.ts:16-19

Conclusion

The vision for Heyme is to provide a simple yet profound service: a digital time capsule for personal reflection and motivation. Through a carefully selected set of features and a robust, service-oriented architecture, the project aims to reliably deliver messages from the past to the future, helping users connect with their own personal history and aspirations. The core of this promise is fulfilled by the automated dispatch system, which ensures that every message reaches its destination at the right time.

Sources: README.md:6-15, pages/api/dispatch.ts