Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions frontend-js/.env.example
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
VITE_SUPABASE_URL=http://127.0.0.1:54321
VITE_SUPABASE_ANON_KEY=your-key-here
54 changes: 50 additions & 4 deletions frontend-js/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,24 +7,32 @@ This directory contains the React + Vite frontend client for the LPI Platform, i
## Setup & Run Instructions

### Prerequisites

Make sure you have [Node.js](https://nodejs.org/) installed.

### 1. Install Dependencies

Navigate to this directory and install the package dependencies:

```bash
cd frontend-js
npm install
```

### 2. Run the Development Server

Start the local Vite development server:

```bash
npm run dev
```

Open the provided local address (typically `http://localhost:5173`) in your browser to view the application.

### 3. Build for Production

To generate a production-ready optimized build:

```bash
npm run build
```
Expand All @@ -34,12 +42,21 @@ npm run build
## Backend Connection & Changes

The frontend connects to the FastAPI backend API running at `http://localhost:8000`. Ensure your backend server is running concurrently by running the following command in the root folder of the project:

```bash
make run
```

### Configuration (`.env` file)

Inside the frontend-js folder make sure you have .env folder containing
VITE_SUPABASE_URL=http://127.0.0.1:54321
VITE_SUPABASE_ANON_KEY=your-key-here

### Configuration (`.env` file)

In the root directory of the project, make sure you have a `.env` file set up with the following configuration:

```env
SUPABASE_URL=https://your-project.supabase.co
SUPABASE_KEY=your-anon-key
Expand All @@ -54,9 +71,8 @@ ADMIN_USER_IDS=your-admin-user-id
> To configure multiple administrators, you can add their user UUIDs in `ADMIN_USER_IDS` separated by a comma (e.g., `ADMIN_USER_IDS=uuid1,uuid2,uuid3`).

### Changing the GitHub Repository for Activity Signals
If you want to add another demo repository in the activity signals feature, replace the default repository name with your GitHub repository name in [SignalsView.jsx](file:///Users/jahanvi/lpi%20jahanvi/lpi-platform/frontend-js/src/components/SignalsView.jsx) at lines **216** (in the auto-sync fetch function) and **305** (in the timeline display filter).


If you want to add another demo repository in the activity signals feature, replace the default repository name with your GitHub repository name in [SignalsView.jsx](file:///Users/jahanvi/lpi%20jahanvi/lpi-platform/frontend-js/src/components/SignalsView.jsx) at lines **216** (in the auto-sync fetch function) and **305** (in the timeline display filter).

### Summary of Backend Changes

Expand All @@ -66,6 +82,36 @@ The following backend files were created or modified to support user authenticat
2. **`src/lpi/main.py`**: Registered new routes for user profiles, `/me` current user context, goals, and activity signal polling.
3. **`src/lpi/middleware/auth.py`**: Modified user authentication middleware to authenticate requests and map incoming requests to user sessions.
4. **`src/lpi/routers/goals.py`**: Updated goal endpoints to filter, create, transition, and delete goals under active user sessions.
5. **`src/lpi/routers/me.py`** *(New)*: Created endpoints to return user profile data for the active logged-in user context.
5. **`src/lpi/routers/me.py`** _(New)_: Created endpoints to return user profile data for the active logged-in user context.
6. **`src/lpi/routers/signals.py`**: Modified signals endpoints to support ingestion, deduplication, chronological sorting, and fetching of activity streams from `Jahanvi3005/demo4`.
7. **`src/lpi/routers/users.py`** *(New)*: Created endpoints for user registration, user map querying, and profile updates.
7. **`src/lpi/routers/users.py`** _(New)_: Created endpoints for user registration, user map querying, and profile updates.

## folder structure

frontend-js/
├── README.md # Setup and running instructions
├── index.html # HTML entry point for the React app
├── package.json # Project dependencies and script runner (Vite)
├── vite.config.js # Vite build tool configuration
├── eslint.config.js # JavaScript formatting/linting rules

├── public/ # Static assets (favicons, SVG assets)

└── src/ # Main React source code
├── main.jsx # React root injection point
├── App.jsx # Main App layout, tab navigation, auth session listener
├── App.css # Base application layout styles
├── api.js # Fetch connection layer to FastAPI endpoints
├── index.css # Global theme styling tokens (dark mode, glassmorphism)
├── supabaseClient.js # Supabase Authentication client initialization

├── src/assets/ # Images and design assets

└── src/components/ # Modular React components and their CSS files
├── LoginPage.jsx / .css # Portal landing / Login / Sign-up layout
├── UserProfile.jsx / .css # Settings page, profile image avatar, display name sync
├── GoalsList.jsx / .css # Dashboard grid wrapper for GoalCards
├── GoalCard.jsx / .css # Individual SMILE phase steppers, transitions, delete panel
├── GoalCreateModal.jsx / .css # Overlay popup wrapper for new goal creation
├── GoalCreateForm.jsx / .css # Fields for Title, Priority, Urgency and SMILE phase select
└── SignalsView.jsx / .css # Chronological timeline polling activity stream from GitHub
Loading