This repository contains the source code for the GRP Status Page, a Next.js React TypeScript application built using shadcn/ui. The status page provides real-time and historical information on the operational status of various services provided by the GRP.
The project's directory structure is as follows:
βββ πapp
βββ πincidents
βββ π[slug]
βββ page.tsx // Dynamic page for each incident
βββ incident.mdx // Incidents are stored in MDX files
βββ page.tsx // Page displaying a list of incidents
βββ favicon.ico
βββ globals.css
βββ layout.tsx // Main layout file
βββ page.tsx // Home page of the status site
app/incidents/
: Contains all the incident reports as.mdx
files. Each incident is documented with a specific date and description.app/incidents/[slug]/page.tsx
: Dynamic route for displaying individual incident details.app/incidents/page.tsx
: Lists all incidents, providing an overview of the operational history.app/layout.tsx
: The layout component for the application.app/page.tsx
: The main entry point for the status page.
- Real-Time Updates: Displays the current operational status of different services/systems.
- Incident History: Comprehensive logs of past incidents, including descriptions, dates, and resolutions.
- Responsive Design: Fully responsive, with a clean and modern UI.
- Markdown Support: Incidents are documented in
.mdx
format, allowing for easy editing and formatting.
To get started with the GRP Status Page, follow these steps:
-
Clone the repository:
git clone https://github.com/grp-org/status.git cd status
-
Install dependencies:
npm install
-
Start the development server:
npm run dev
The application should now be running at http://localhost:3000.
To view the list of all incidents, navigate to the homepage. You can click on any incident to view detailed information.
To document a new incident:
-
Use the CLI tool to create a new incident file.
node ./cli/create_incident.js
-
Follow the prompts to enter the incident details, such as date, title, and description.
-
The new incident will be automatically created in the
app/incidents/
directory and listed on the incidents page.
To edit an existing incident:
-
Use the CLI tool to edit the incident file.
node ./cli/edit_incident.js
-
Select the incident you wish to edit from the list and follow the prompts.
-
The message you added will automatically be appended to the description of the incident.
The cli
directory contains scripts to help automate the process of creating and editing incidents.
-
create_incident.js
&create_incident.ts
: These scripts allow you to create a new incident by prompting you for the necessary details (date, title, description) and then generating an.mdx
file in theapp/incidents/
directory. -
edit_incident.js
&edit_incident.ts
: These scripts enable you to edit an existing incident. They list all incidents and allow you to select one for editing.
To create a new incident, simply run:
node ./cli/create_incident.js
This will guide you through the process of adding a new incident.
We welcome contributions! Please follow these steps to contribute:
- Fork the repository.
- Create a new branch (
git checkout -b feature-branch
). - Make your changes.
- Commit your changes (
git commit -m 'Add some feature'
). - Push to the branch (
git push origin feature-branch
). - Open a pull request.
This project is licensed under the MIT License. See the LICENSE file for details.