Power of One News Admin Panel

Power of One News Admin Panel is a web-based CMS for the Power of One News platform. Administrators manage news articles, categories, short-form stories, magazines, advertisements, user-generated content, push notifications, and site configuration from a single dashboard.

The application is a Next.js 15 frontend that communicates with the backend API. Media assets are stored on AWS S3.

Prerequisites

• Node.js >= 18.18.0
• npm (or yarn / pnpm)
• Access to the Power of One News backend API
• Google Cloud Translation API key (for translation features)

Installation

# Clone the repository
git clone <repository-url>
cd POON_Admin

# Install dependencies
npm install

# Create .env.local with required keys (see Environment Variables)

# Start development server
npm run dev

Open http://localhost:3000 and log in with an authorized admin mobile number.

Available Scripts

Create a .env.local file in the project root:

# Backend API base URL (optional — defaults to production API)
NEXT_PUBLIC_API_BASE_URL=https://backend.powerofonenews.com/api

# AES encryption key for auth payloads (optional — has built-in fallback)
NEXT_PUBLIC_ENTK_VALUE=your-encryption-key

# Google Cloud Translation API key (required for auto-translation)
NEXT_PUBLIC_GOOGLE_TRANSLATE_API_KEY=your-google-translate-api-key

# LibreTranslate API URL (optional fallback for translation)
NEXT_PUBLIC_LIBRETRANSLATE_API_URL=https://libretranslate.de/translate

Core Content Management

Engagement & Users

Platform Capabilities

Frontend

External Services

┌─────────────────────────────────────────────────────────────┐
│                    Admin Browser (Client)                    │
│  ┌─────────────┐  ┌──────────────┐  ┌─────────────────────┐ │
│  │ Login / OTP │  │  Dashboard   │  │  Module Components  │ │
│  └──────┬──────┘  └──────┬───────┘  └──────────┬──────────┘ │
│         └────────────────┼──────────────────────┘            │
│                          ▼                                   │
│              ┌───────────────────────┐                       │
│              │   apiService (api.ts) │                       │
│              │   axiosClient         │                       │
│              │   AES Encryption      │                       │
│              └───────────┬───────────┘                       │
└──────────────────────────┼───────────────────────────────────┘
                           │ HTTPS (Bearer Token)
                           ▼
              ┌────────────────────────┐
              │  Backend API           │
              │  backend.powerofone-   │
              │  news.com/api          │
              └───────────┬────────────┘
                          ▼
              ┌────────────────────────┐
              │  AWS S3 (media)        │
              └────────────────────────┘

Request Flow

1. Admin enters mobile number → OTP sent via encrypted payload to /admin/auth/otp/send
2. Admin verifies OTP → JWT token returned from /admin/auth/otp/verify
3. Token stored in localStorage as authToken
4. All subsequent requests include Authorization: Bearer <token> via Axios interceptor
5. On 401 response, session is cleared and user is redirected to login

Routing Model

Login Flow

1. Mobile Number — Admin enters a 10-digit Indian mobile number
2. OTP Send — apiService.sendOtp(mobile) encrypts { mobile } with AES and posts to /admin/auth/otp/send
3. OTP Verify — Admin enters OTP; encrypted payload posted to /admin/auth/otp/verify
4. Session — On success, authToken, isAuthenticated, and mobile are stored in localStorage

Session Protection

• Dashboard checks isAuthenticated on mount; redirects to / if missing
• Axios interceptor attaches Bearer token to every request
• 401 responses clear session and surface "Session expired" errors
• Logout clears all auth keys and redirects to login

Supported Languages

Article Translation

When creating or editing articles, admins can enable automatic translation via translation.ts:

• Translates title, subtitle, description, and content
• Uses Google Cloud Translation API when API key is set
• Fallback providers: LibreTranslate, MyMemory
• Groups translations via translationGroupId on the backend

CI/CD (GitHub Actions)

Pushing to the main branch triggers automatic deployment:

1. Code synced via rsync to server at 52.221.144.52
2. Deploy path: /var/www/html/powerofone-news-admin/
3. npm install and npm run build run on the server
4. PM2 starts the app as powerkaadmin on port 9999

Manual Deployment

npm install
npm run build
npm run start -- -p 9999

# Or with PM2:
pm2 start npm --name "powerkaadmin" -- run start -- -p 9999

Base URL: NEXT_PUBLIC_API_BASE_URL or https://backend.powerofonenews.com/api

Client: src/utils/axiosClient.ts · Service: src/utils/api.ts

All endpoint constants are defined in API_ENDPOINTS inside src/utils/api.ts.

Uploaded images and files are stored on AWS S3. The API returns relative paths; the frontend constructs full URLs:

https://stagingpowerofnews.s3.ap-southeast-1.amazonaws.com/<path>

• POST /admin/upload-image — Featured images, category images
• POST /admin/upload-contentImage — Inline content images in the rich text editor