Decision Analyzer Log

A modern, minimal CRUD app for making better decisions through structured analysis and option evaluation.

Overview

Decision Analyzer helps users organize their thoughts, evaluate options with ratings, and make informed decisions. This frontend provides an intuitive interface for decision management, option evaluation, and administrative oversight.

Live Demo: Deployed on Vercel

Features

• User Authentication - Secure registration and login with JWT tokens
• Decision Management - Create, view, edit, and delete decisions
• Option Evaluation - Add options to decisions with 1-5 rating system
• Admin Dashboard - User management, role promotion, platform statistics
• Role-Based Access - User and admin roles with different permissions
• Responsive Design - Works seamlessly on desktop, tablet, and mobile

Tech Stack

• Framework: React 19.2.0
• Build Tool: Vite 7.3.1
• Routing: React Router DOM 6.20.0
• HTTP Client: Axios 1.7.7
• Styling: CSS3 with CSS Variables
• State Management: React Context API
• Authentication: Supabase JWT

Prerequisites

• Node.js 16+ and npm/yarn
• Backend API running (or use production URL)
• Supabase account (for authentication)

Getting Started

Installation

# Clone the repository
git clone https://github.com/LibraAkaja/Decision-Analysis-Log.git
cd Frontend

# Install dependencies
npm install

Environment Variables

Create a .env file in the Frontend directory:

VITE_API_URL=https://decision-analyzer-log-backend.onrender.com/api/v1

For local development:

VITE_API_URL=http://localhost:8000/api/v1

Running Locally

# Start development server
npm run dev

# Visit http://localhost:5173

API Endpoints

Authentication:

• POST /auth/register - Register new user
• POST /auth/login - Login user
• POST /auth/refresh - Refresh token
• GET /auth/me - Get current user profile
• POST /auth/logout - Logout user

Decisions:

• GET /decisions - Get all user decisions
• POST /decisions - Create new decision
• GET /decisions/{id} - Get decision with options
• PATCH /decisions/{id} - Update decision
• DELETE /decisions/{id} - Delete decision

Options:

• POST /options - Add option to decision
• GET /options/{decision_id} - Get options for decision
• PATCH /options/{id} - Update option
• DELETE /options/{id} - Delete option

Admin:

• GET /admin/users - Get all users
• PATCH /admin/users/{id}/role - Update user role
• DELETE /admin/users/{id} - Delete user
• GET /admin/dashboard - Get platform statistics

User Flow

1. Visit http://localhost:5173 Home page
2. Click "Register" Fill form Submit
3. Auto-redirects to /dashboard
4. Create decision Add options (1-5 rating)
5. Edit/delete options and decisions
6. Click logout Back to login

Admin Flow

1. Register as regular user
2. (Backend) Promote user to admin role
3. Login Can access /admin
4. View users, statistics
5. Promote/demote users
6. Delete users

Deployment

Deploy to Vercel

1. Push to GitHub

   git push origin main

2. Connect to Vercel

   • Go to https://vercel.com
   • Import the repository
   • Set environment variable: VITE_API_URL=https://decision-analyzer-log-backend.onrender.com/api/v1
   • Deploy

3. Verify Deployment

   • Frontend: https://decision-analyzer-log.vercel.app
   • Backend: https://decision-analyzer-log-backend.onrender.com/api/v1

Best Practices

• Keep components focused and reusable
• Use React Context for state management
• Leverage CSS variables for theming
• Handle loading and error states
• Validate form inputs before submission
• Use semantic HTML

License

This project is part of the Decision Analyzer Log suite.

Support

For issues or questions, contact LibraAkaja or open an issue on GitHub.