diff --git a/.env b/.env deleted file mode 100644 index c6c9e5d6..00000000 --- a/.env +++ /dev/null @@ -1,7 +0,0 @@ -REACT_APP_MANIFEST=https://raw.githubusercontent.com/tadhglewis/issue-status/master/.issuestatus/manifest.json -REACT_APP_FAVICON=https://raw.githubusercontent.com/tadhglewis/issue-status/master/.issuestatus/favicon.ico -REACT_APP_TITLE=Issue Status Demo -REACT_APP_DESCRIPTION=Simple, modern and flexible status page -REACT_APP_LOGO=https://raw.githubusercontent.com/tadhglewis/issue-status/master/.issuestatus/logo.png -REACT_APP_NAME=Issue Status -REACT_APP_REPOSITORY=tadhglewis/issue-status \ No newline at end of file diff --git a/.gitignore b/.gitignore deleted file mode 100644 index 4d29575d..00000000 --- a/.gitignore +++ /dev/null @@ -1,23 +0,0 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/.pnp -.pnp.js - -# testing -/coverage - -# production -/build - -# misc -.DS_Store -.env.local -.env.development.local -.env.test.local -.env.production.local - -npm-debug.log* -yarn-debug.log* -yarn-error.log* diff --git a/.issuestatus/favicon.ico b/.issuestatus/favicon.ico deleted file mode 100644 index 004670e8..00000000 Binary files a/.issuestatus/favicon.ico and /dev/null differ diff --git a/.issuestatus/logo.png b/.issuestatus/logo.png deleted file mode 100644 index 6d426811..00000000 Binary files a/.issuestatus/logo.png and /dev/null differ diff --git a/.issuestatus/logo192.png b/.issuestatus/logo192.png deleted file mode 100644 index 09f9276d..00000000 Binary files a/.issuestatus/logo192.png and /dev/null differ diff --git a/.issuestatus/logo512.png b/.issuestatus/logo512.png deleted file mode 100644 index a3eede39..00000000 Binary files a/.issuestatus/logo512.png and /dev/null differ diff --git a/.issuestatus/manifest.json b/.issuestatus/manifest.json deleted file mode 100644 index 326053b4..00000000 --- a/.issuestatus/manifest.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "short_name": "Issue Status", - "name": "Simple, modern and flexible status page", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": "https://tadhglewis.github.io/issue-status", - "display": "standalone", - "theme_color": "#3da751" -} diff --git a/.vscode/settings.json b/.vscode/settings.json deleted file mode 100644 index ad92582b..00000000 --- a/.vscode/settings.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "editor.formatOnSave": true -} diff --git a/LICENSE b/LICENSE deleted file mode 100644 index 9e9af14e..00000000 --- a/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2020 Tadhg Lewis - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/README.md b/README.md deleted file mode 100644 index 9b28a73c..00000000 --- a/README.md +++ /dev/null @@ -1,90 +0,0 @@ -# Issue Status - -Simple, modern and flexible status page - -![Banner](/banner.gif?raw=true) - -Issue Status is the static client-side status page built on React using GitHub Issues for Component and Incident reporting with live updating using the GitHub API, there is no need to rebuild and redeploy for every update. All hosted on GitHub Pages - -## Demo - -You can view the Issue Status demo [here](https://tadhglewis.github.io/issue-status). This demo is hosted on GitHub Pages - -## Features - -- Easy setup -- Show status of your services using Components -- Report Incidents -- Markdown support -- Component and Incident templates -- Easy integration with services and monitoring -- Live updating status page -- Hosting on GitHub Pages or other hosting providers -- Use Zapier Triggers to update the status page - -## Setup - -- Clone / Fork this repository to your GitHub account (forking only required for GitHub Pages) -- Run `git checkout tags/VERSION` to checkout to the [latest version](#configuration). It is not recommended to setup using the master branch -- Edit the `.env` file found in the root directory and enter your [configuration options](#configuration) - -### GitHub Pages - -- Run `yarn deploy` this will build the React project and deploy it to the `gh-pages` branch -- Finally make sure GitHub Pages option in your GitHub repository settings is set to use the `gh-pages` branch - -### Other hosting providers - -- Run `yarn build` this will create a build directory containing the built app -- For deploying [click here](https://create-react-app.dev/docs/deployment) - -You may also want to [configure issue templates for your repository](https://help.github.com/en/github/building-a-strong-community/configuring-issue-templates-for-your-repository) which will act as Component and Incident templates. **Including the `issue status` label in an issue template will allow unauthorised GitHub users to update the status page, this should be added when creating the issue** - -## Update - -Updating is important to get the latest features and patches - -- [This guide](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/syncing-a-fork) should bring you through the steps of syncing your forked version of this repository. Ensure you have backed up your `.env` configuration file as this may be overwritten, you will need to make sure you include the env variables from the latest version -- Run `git checkout tags/VERSION` to checkout to the [latest version](#configuration). It is not recommended to setup using the master branch - -### GitHub Pages - -- Run `yarn deploy` to deploy the latest version to GitHub Pages - -### Other hosting providers - -- Run `yarn build` to create a new build directory -- For deploying [click here](https://create-react-app.dev/docs/deployment) - -## Advanced - -Integrate and automate Components and Incidents, this may be useful for changing a Component to `major outage` when you detect your services aren't running or `performance issues` when the response time goes over a set point. - -- Issue Status API (GitHub API wrapper) - [In the future](https://github.com/tadhglewis/issue-status/issues/18), there will be a GitHub API wrapper which can be hosted on a server. This will expose simplified endpoints for integrating with monitoring services, IFTTT and any other services -- [IFTTT](https://ifttt.com) - This is currently not possible due to a couple issues. 1. GitHub service does not include labels in the create Issue action. 2. The GitHub service does not have an update Issue action. It is also not possible to call the GitHub API directly as IFTTT does not include a User-Agent header in the Webhooks service and [all requests with no User-Agent header will be rejected by the GitHub API](https://developer.github.com/v3/#user-agent-required). This is possible using the Issue Status API -- [Zapier](https://zapier.com) - You can create Zaps which have a trigger and an action, use the GitHub Integrations action to update/created Components and Incidents with any of the Zapier Triggers -- [GitHub API](https://developer.github.com) - You can use the GitHub API directly, you can use this for more advanced options - -## Configuration - -Customise your status page - ensure all required options are entered and any unused optional options are set blank, ie `REACT_APP_MANIFEST=` - -- `REACT_APP_MANIFEST` (optional) - Determines the manifest url in the built HTML file -- `REACT_APP_TITLE` (required) - Determines the `` tag in the built HTML file with suffix `Status` -- `REACT_APP_DESCRIPTION` (optional) - Determines the description `<meta>` tag in the built HTML file -- `REACT_APP_LOGO` (optional) - Accepts an image URL and is used in the status page header -- `REACT_APP_NAME` (optional) - Used in the status page header when no `REACT_APP_LOGO` is provided. This will be used in the img alt attribute if a logo is provided -- `REACT_APP_REPOSITORY` (required) - GitHub `username/repository` that Components and Incidents will be fetched from, ie `tadhglewis/issue-status` - -## Details - -- The main status bar logic is as follows: < 70% Components `operational` = "Some systems are experiencing issues", more than 0 Components `major outage` = "Some systems are experiencing a major outage". Otherwise, "All Systems Operational" -- A `Component` each display a current status. To create a Component add tags `issue status`, `component` and a tag for the current status: `operational`, `performance issues`, `partial outage` or `major outage` (if an issue only has `issue status` and `component` it will be listed as `Unknown`) to a GitHub Issue. You can view all the demo Components [here](https://github.com/tadhglewis/issue-status/issues?q=is%3Aissue+label%3A%22issue+status%22+label%3A%22component%22) -- A `Incident` will show in the Incidents section as either `Active` or `Closed` depending whether on the GitHub Issue is Open or Closed. To create an Incident add tags `issue status` and `incident` to a GitHub Issue. You can view all the demo Incidents [here](https://github.com/tadhglewis/issue-status/issues?q=is%3Aissue+label%3A%22issue+status%22+label%3A%22incident%22) -- Issue Status uses the [GitHub API v3](https://developer.github.com/v3) which has a rate limit of 60 requests per hour for unauthenticated requests (Issue Status is client side and will use unauthenticated requests). Issue Status will fetch 15 times per hour, sending 2 requests per fetch / 30 requests per hour (excluding reload button) - -If you have any issues or questions feel free to contact me or create an issue - -## Version - -1.1.2 diff --git a/banner.gif b/banner.gif deleted file mode 100644 index 100aa2ee..00000000 Binary files a/banner.gif and /dev/null differ diff --git a/banner.png b/banner.png deleted file mode 100644 index aadb3876..00000000 Binary files a/banner.png and /dev/null differ diff --git a/package.json b/package.json deleted file mode 100644 index 007dc7b9..00000000 --- a/package.json +++ /dev/null @@ -1,44 +0,0 @@ -{ - "name": "issue-status", - "version": "0.1.0", - "private": true, - "homepage": ".", - "dependencies": { - "moment": "2.30.1", - "react": "18.2.0", - "react-dom": "18.2.0", - "react-markdown": "9.0.1", - "react-scripts": "5.0.1", - "styled-components": "6.1.8" - }, - "scripts": { - "start": "react-scripts start", - "build": "react-scripts build", - "test": "react-scripts test", - "eject": "react-scripts eject", - "predeploy": "npm run build", - "deploy": "gh-pages -d build" - }, - "eslintConfig": { - "extends": "react-app" - }, - "browserslist": { - "production": [ - ">0.2%", - "not dead", - "not op_mini all" - ], - "development": [ - "last 1 chrome version", - "last 1 firefox version", - "last 1 safari version" - ] - }, - "devDependencies": { - "@testing-library/jest-dom": "^6.4.2", - "@testing-library/react": "^14.2.1", - "@testing-library/user-event": "^14.5.2", - "gh-pages": "^3.2.3", - "prettier": "^2.4.1" - } -} diff --git a/public/index.html b/public/index.html deleted file mode 100644 index 9160fb90..00000000 --- a/public/index.html +++ /dev/null @@ -1,40 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> - <head> - <meta charset="utf-8" /> - <link rel="icon" href="%REACT_APP_FAVICON%" /> - <meta name="viewport" content="width=device-width, initial-scale=1" /> - <meta name="theme-color" content="#3da751" /> - <meta name="description" content="%REACT_APP_DESCRIPTION%" /> - <link rel="apple-touch-icon" href="%REACT_APP_FAVICON%" /> - <!-- - manifest.json provides metadata used when your web app is installed on a - user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ - --> - <link rel="manifest" href="%REACT_APP_MANIFEST%" /> - <!-- - Notice the use of %PUBLIC_URL% in the tags above. - It will be replaced with the URL of the `public` folder during the build. - Only files inside the `public` folder can be referenced from the HTML. - - Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will - work correctly both with client-side routing and a non-root public URL. - Learn how to configure a non-root public URL by running `npm run build`. - --> - <title>%REACT_APP_TITLE% Status - - - -
- - - diff --git a/public/robots.txt b/public/robots.txt deleted file mode 100644 index e9e57dc4..00000000 --- a/public/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/src/App.test.js b/src/App.test.js deleted file mode 100644 index 4db7ebc2..00000000 --- a/src/App.test.js +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import { render } from '@testing-library/react'; -import App from './App'; - -test('renders learn react link', () => { - const { getByText } = render(); - const linkElement = getByText(/learn react/i); - expect(linkElement).toBeInTheDocument(); -}); diff --git a/src/components/App.css b/src/components/App.css deleted file mode 100644 index e69de29b..00000000 diff --git a/src/components/App.js b/src/components/App.js deleted file mode 100644 index 393890e3..00000000 --- a/src/components/App.js +++ /dev/null @@ -1,64 +0,0 @@ -import React from "react"; -import "./App.css"; -import styled from "styled-components"; -import Status from "./status"; -import useIssues from "./useIssues"; -import Header from "./header"; -import Components from "./components"; -import Incidents from "./incidents"; -import Footer from "./footer"; - -const Container = styled.div` - max-width: 1008px; - padding: 16px; - margin: 16px auto; -`; - -const ComponentsContainer = styled.div` - box-shadow: 0px 0px 33px -32px rgba(0, 0, 0, 0.75); - border-radius: 3px; - background-color: white; - padding: 16px; -`; - -export default () => { - // loading, errors, results, refetch - const [ - componentsLoading, - componentsError, - componentsResults, - componentsRefetch, - ] = useIssues("component"); - const [ - incidentsLoading, - incidentsError, - incidentsResults, - incidentsRefetch, - ] = useIssues("incident"); - - return ( - -
- - { - componentsRefetch(); - incidentsRefetch(); - }} - /> - - - -