initial commits

naupaw · Aug 3, 2020 · 05c58af · 05c58af
commit 05c58af
Show file tree

Hide file tree

Showing 17 changed files with 7,314 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+.next
diff --git a/LICENSE.md b/LICENSE.md
@@ -0,0 +1,9 @@
+MIT License
+
+Copyright (c) 2020 Naufal Fadhil
+
+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
@@ -0,0 +1,3 @@
+# pm2 panel
+
+docs soon.
diff --git a/components/Base.tsx b/components/Base.tsx
@@ -0,0 +1,33 @@
+import {
+  AppBar,
+  colors,
+  Container,
+  Toolbar,
+  Typography,
+} from '@material-ui/core'
+import React, { Fragment } from 'react'
+
+const Base = ({ children }) => {
+  return (
+    <Fragment>
+      <AppBar position='fixed'>
+        <Toolbar>
+          <Typography variant='h6'>Process Monitor</Typography>
+        </Toolbar>
+      </AppBar>
+      <div
+        style={{
+          backgroundColor: colors.grey[100],
+          minHeight: '100vh',
+        }}
+      >
+        <Toolbar />
+        <Container maxWidth={'lg'} style={{ marginTop: 30 }}>
+          {children}
+        </Container>
+      </div>
+    </Fragment>
+  )
+}
+
+export default Base
diff --git a/next-env.d.ts b/next-env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
diff --git a/package.json b/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "pm2-panel",
+  "version": "1.0.0",
+  "main": "index.js",
+  "author": "pedox",
+  "license": "MIT",
+  "dependencies": {
+    "@material-ui/core": "^4.11.0",
+    "@material-ui/icons": "^4.9.1",
+    "axios": "^0.19.2",
+    "clsx": "^1.1.1",
+    "next": "^9.5.1",
+    "pm2": "^4.4.0",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "read-last-lines": "^1.7.2"
+  },
+  "devDependencies": {
+    "@types/node": "^14.0.27",
+    "@types/react": "^16.9.44",
+    "@types/react-dom": "^16.9.8",
+    "typescript": "^3.9.7"
+  },
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start"
+  }
+}
diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -0,0 +1,40 @@
+import CssBaseline from '@material-ui/core/CssBaseline'
+import { ThemeProvider } from '@material-ui/core/styles'
+import Head from 'next/head'
+import PropTypes from 'prop-types'
+import React from 'react'
+import theme from '../util/theme'
+
+export default function MyApp(props) {
+  const { Component, pageProps } = props
+
+  React.useEffect(() => {
+    // Remove the server-side injected CSS.
+    const jssStyles = document.querySelector('#jss-server-side')
+    if (jssStyles) {
+      jssStyles.parentElement.removeChild(jssStyles)
+    }
+  }, [])
+
+  return (
+    <React.Fragment>
+      <Head>
+        <title>Monitor</title>
+        <meta
+          name='viewport'
+          content='minimum-scale=1, initial-scale=1, width=device-width'
+        />
+      </Head>
+      <ThemeProvider theme={theme}>
+        {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
+        <CssBaseline />
+        <Component {...pageProps} />
+      </ThemeProvider>
+    </React.Fragment>
+  )
+}
+
+MyApp.propTypes = {
+  Component: PropTypes.elementType.isRequired,
+  pageProps: PropTypes.object.isRequired,
+}
diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -0,0 +1,71 @@
+import { ServerStyleSheets } from '@material-ui/core/styles'
+import Document, { Head, Html, Main, NextScript } from 'next/document'
+import React from 'react'
+import theme from '../util/theme'
+
+export default class MyDocument extends Document {
+  render() {
+    return (
+      <Html lang='en'>
+        <Head>
+          {/* PWA primary color */}
+          <meta name='theme-color' content={theme.palette.primary.main} />
+          <link
+            rel='stylesheet'
+            href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap'
+          />
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    )
+  }
+}
+
+// `getInitialProps` belongs to `_document` (instead of `_app`),
+// it's compatible with server-side generation (SSG).
+MyDocument.getInitialProps = async (ctx) => {
+  // Resolution order
+  //
+  // On the server:
+  // 1. app.getInitialProps
+  // 2. page.getInitialProps
+  // 3. document.getInitialProps
+  // 4. app.render
+  // 5. page.render
+  // 6. document.render
+  //
+  // On the server with error:
+  // 1. document.getInitialProps
+  // 2. app.render
+  // 3. page.render
+  // 4. document.render
+  //
+  // On the client
+  // 1. app.getInitialProps
+  // 2. page.getInitialProps
+  // 3. app.render
+  // 4. page.render
+
+  // Render app and page and get the context of the page with collected side effects.
+  const sheets = new ServerStyleSheets()
+  const originalRenderPage = ctx.renderPage
+
+  ctx.renderPage = () =>
+    originalRenderPage({
+      enhanceApp: (App) => (props) => sheets.collect(<App {...props} />),
+    })
+
+  const initialProps = await Document.getInitialProps(ctx)
+
+  return {
+    ...initialProps,
+    // Styles fragment is rendered after the app and page rendering finish.
+    styles: [
+      ...React.Children.toArray(initialProps.styles),
+      sheets.getStyleElement(),
+    ],
+  }
+}
diff --git a/pages/api/action.ts b/pages/api/action.ts
@@ -0,0 +1,56 @@
+import pm2 from 'pm2'
+
+export default async (req, res) => {
+  try {
+    if (req.method !== 'POST') {
+      return res.json({ message: 'Not implemented' })
+    }
+
+    const { id, action } = req.body
+    if (!id && !action) {
+      return res.json({ message: 'please fill required field' })
+    }
+
+    const result = await new Promise((resolve, reject) => {
+      const theCallback = (err) => {
+        if (err) {
+          pm2.disconnect()
+          console.error(err)
+          return reject({ message: 'failed to process action' })
+        }
+        pm2.disconnect()
+        return resolve({ message: 'ok' })
+      }
+
+      pm2.connect((err) => {
+        if (err) return reject({ message: 'couldnt connect to pm2' })
+
+        if (action === 'restart') {
+          pm2.restart(id, (err) => {
+            return theCallback(err)
+          })
+        }
+
+        if (action === 'start') {
+          pm2.start(
+            {
+              name: id,
+            },
+            (err) => {
+              return theCallback(err)
+            }
+          )
+        }
+
+        if (action === 'stop') {
+          pm2.stop(id, (err) => {
+            return theCallback(err)
+          })
+        }
+      })
+    })
+    return res.json(result)
+  } catch (e) {
+    return res.status(500).json(e)
+  }
+}
diff --git a/pages/api/all.ts b/pages/api/all.ts
@@ -0,0 +1,23 @@
+import pm2 from 'pm2'
+
+export default async (req, res) => {
+  try {
+    const result = await new Promise((resolve, reject) => {
+      pm2.connect((err) => {
+        if (err) return reject({ message: 'couldnt connect to pm2' })
+
+        pm2.list((err, list) => {
+          if (err) {
+            pm2.disconnect()
+            return reject({ message: 'couldnt getting list pm2' })
+          }
+          pm2.disconnect()
+          return resolve({ data: list })
+        })
+      })
+    })
+    return res.json(result)
+  } catch (e) {
+    return res.code(500).json(e)
+  }
+}
diff --git a/pages/api/process/[processId].ts b/pages/api/process/[processId].ts
@@ -0,0 +1,36 @@
+import pm2 from 'pm2'
+import readLast from 'read-last-lines'
+
+export default async (req, res) => {
+  try {
+    const { processId } = req.query
+    const result = await new Promise((resolve, reject) => {
+      pm2.connect((err) => {
+        if (err) return reject({ message: 'couldnt connect to pm2' })
+
+        pm2.describe(processId, async (err, desc) => {
+          if (err) {
+            pm2.disconnect()
+            return reject({ message: 'couldnt getting list pm2' })
+          }
+          pm2.disconnect()
+
+          if (desc.length > 0) {
+            const data = desc[0]
+            const log = await readLast.read(data.pm2_env.pm_out_log_path, 100)
+            const errLog = await readLast.read(
+              data.pm2_env.pm_err_log_path,
+              100
+            )
+            return resolve({ data: { ...desc[0], log, errLog } })
+          }
+          return resolve({ message: 'process not found' })
+        })
+      })
+    })
+    return res.json(result)
+  } catch (e) {
+    console.error(e)
+    return res.status(500).json(e)
+  }
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		/// <reference types="next" />
		/// <reference types="next/types/global" />