User Profiles & Social

User Profiles & Dashboards

Blogify provides a personalized experience for every writer. Once authenticated, users gain access to a dedicated dashboard to manage their content and a public profile that showcases their contributions to the community.

Personal Dashboard

The Dashboard serves as your private control center. From here, you can:

• Manage Content: View a filtered list of all your published posts.
• Quick Actions: Access shortcuts to edit or delete your existing stories.
• Account Summary: View your join date and total post count.

Public Profiles

Every user on the platform has a public profile page accessible via /profile/[id]. This page is the primary way for readers to discover an author's body of work. It displays:

• The author's name and profile picture.
• A chronological feed of all posts written by that specific user.
• Metadata such as account creation date.

Social Discovery

Community interaction in Blogify is driven by author attribution and seamless navigation between content and creators.

• Author Attribution: Every post in the global feed and on individual post pages displays the author's name.
• Profile Navigation: Clicking on an author's name anywhere in the application redirects you to their public profile, allowing you to explore more of their writing.
• Featured Feed: The main feed highlights recent stories, helping new authors gain visibility within the community.

Developer Reference

For developers extending the platform or integrating with the user system, the following data structures and API methods are available in frontend/src/lib/api.ts.

Data Models

User Interface

The User object represents a registered member of the platform.

export interface User {
  id: string;
  name: string;
  email: string;
  profile_picture_url?: string;
  created_at: string;
}

User Update Interface

Used when sending partial updates to the user's profile information.

export interface UserUpdate {
  name?: string;
  email?: string;
  profile_picture_url?: string | null;
}

Profile Methods

Fetching a User

Retrieves public profile information for a specific user ID.

export async function getUser(id: string): Promise<User>

Updating the Current User

Updates the profile of the currently authenticated user. This requires an active Supabase session.

export async function updateUser(data: UserUpdate): Promise<User>

Example Usage:

import { updateUser } from '@/lib/api';

const handleUpdateProfile = async () => {
  try {
    const updatedUser = await updateUser({
      name: "New Display Name",
      profile_picture_url: "https://example.com/photo.jpg"
    });
    console.log("Profile updated:", updatedUser.name);
  } catch (error) {
    console.error("Update failed", error);
  }
};

Identity & Security

• Authentication via Supabase: User identities are managed through Supabase Auth, ensuring secure login and session management.
• Row Level Security (RLS): Profile updates are protected by RLS policies. Users can only modify their own profile data, while public profile information remains read-only for other visitors.
• Avatar Storage: Profile pictures are stored in the images bucket within Supabase Storage, with public URLs generated for rendering in the UI.