In-App Support Flow

Relevant source files

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

• artifacts/api-server/src/routes/support.ts
• artifacts/mobile/services/supportService.ts
• artifacts/mobile/app/support.tsx
• attached_assets/Pasted-Build-a-real-in-app-support-request-flow-for-the-React-_1774839229732.txt
• attached_assets/Pasted-Make-a-truth-alignment-pass-across-the-current-React-Na_1774837201847.txt
• attached_assets/Pasted-Make-a-focused-networking-and-API-consistency-pass-acro_1774841954107.txt

The In-App Support Flow provides users with a direct mechanism to submit technical or hospice-related inquiries to the support team. It transitions the application from a legacy mailto link approach to a robust, API-backed submission system. This flow ensures that requests are captured in a centralized database, assigned unique identifiers, and supported by an email fallback mechanism in case of network or server failures.

Sources: Pasted-Build-a-real-in-app-support-request-flow-for-the-React-_1774839229732.txt, artifacts/mobile/app/support.tsx:1-20

System Architecture

The support system is built on a client-server architecture. The mobile client (React Native/Expo) captures user input and interacts with the Express API server via a dedicated service layer. The server validates the request, associates it with a client identity, and persists the data to a PostgreSQL database using Drizzle ORM.

Request Lifecycle

The following sequence diagram illustrates the standard successful submission flow:

Mobile Implementation

The mobile interface is managed in artifacts/mobile/app/support.tsx. It features a form for capturing user details and a multi-state UI for handling submission progress and results.

Data Capture and Validation

The client collects specific fields required for triaging the support request.

Field	Type	Requirement
name	string	Required after trim
email	string	Required, must contain "@"
phone	string	Optional
topic	string	Required
preferredContact	"email" | "phone"	Required
message	string	Required, min 10 characters

Sources: Pasted-Build-a-real-in-app-support-request-flow-for-the-React-_1774839229732.txt, artifacts/mobile/app/support.tsx:25-50

Failure and Fallback Logic

If the API submission fails (e.g., due to status code non-200/201), the app triggers a fallback mechanism. The user is presented with an Alert offering a "Try Email Instead" option, which constructs a pre-filled mailto URL.

API Server Implementation

The server-side logic resides in artifacts/api-server/src/routes/support.ts. It handles input normalization, security headers, and database persistence.

Client Identity Management

The server extracts the x_client_id header to associate requests with specific device installations.

• Valid ID: Matches regex ^client_[a-z0-9_]+$.
• Fallback: Defaults to "anonymous_support" if the header is missing or invalid.

Sources: artifacts/api-server/src/routes/support.ts:10-25, Pasted-Build-a-real-in-app-support-request-flow-for-the-React-_1774839229732.txt

Database Schema

The support_requests table tracks the lifecycle of every inquiry.

Column	Type	Constraints
id	serial	Primary Key
client_id	text	Not Null, default "anonymous_support"
topic	text	Not Null (Indexed)
status	text	Default "received" (Indexed)
source	text	Default "ios_app"
created_at	timestamp	Default now() (Indexed)

Sources: Pasted-Build-a-real-in-app-support-request-flow-for-the-React-_1774839229732.txt

Networking Consistency

The flow adheres to the project's standardized networking patterns defined in apiClient.ts. This includes:

• Base URL Resolution: Dynamically resolved for Replit/Expo environments.
• Timeouts: Uses makeRequestTimeoutSignal (default 12000ms).
• Headers: Mandatory Content-Type: application/json and x_client_id.

Sources: Pasted-Make-a-focused-networking-and-API-consistency-pass-acro_1774841954107.txt, artifacts/mobile/services/supportService.ts:10-20

Conclusion

The In-App Support Flow provides a reliable, dual-channel communication path for users. By prioritizing internal API submission while maintaining an honest email fallback, the system ensures high availability for user assistance even in degraded network conditions.

Sources: artifacts/mobile/app/support.tsx, artifacts/api-server/src/routes/support.ts