Release 1.2.5

Luligu · Apr 6, 2024 · 52ada58 · 52ada58
1 parent f554e7e
commit 52ada58
Show file tree

Hide file tree

Showing 24 changed files with 263 additions and 195 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,8 +5,11 @@ All notable changes to this project will be documented in this file.
 ## [1.2.5] - 2024-04-05
 
 ### Added
-- [frontend]: Added shutdown button  
-- [frontend]: Added login with password (default no password) 
+- [frontend]: Added update Matterbridge (spawn the command: 'npm -install -g matterbridge'). The console inherit the the spawned process running so you can check.
+- [frontend]: Added install plugin (spawn the command: 'npm -install -g plugin-name'). The console inherit the the spawned process running so you can check.
+- [frontend]: Added shutdown button.
+- [frontend]: Added login with password (default no password). Change the password in the Settings page of frontend.
+- [frontend]: Frontend got updated to 0.8.5.
 - [Matterbridge]: Added configuration and guidelines in the readme to run Matterbridge like a daemon with systemctl on Linux machine.
 
 ## [1.2.4] - 2024-04-01

diff --git a/frontend/build/Matterbridge.jpg b/frontend/build/Matterbridge.jpg
diff --git a/frontend/build/asset-manifest.json b/frontend/build/asset-manifest.json
@@ -1,15 +1,15 @@
 {
   "files": {
     "main.css": "/static/css/main.61f6cf42.css",
-    "main.js": "/static/js/main.2e25398b.js",
+    "main.js": "/static/js/main.6b861489.js",
     "static/js/453.d855a71b.chunk.js": "/static/js/453.d855a71b.chunk.js",
     "index.html": "/index.html",
     "main.61f6cf42.css.map": "/static/css/main.61f6cf42.css.map",
-    "main.2e25398b.js.map": "/static/js/main.2e25398b.js.map",
+    "main.6b861489.js.map": "/static/js/main.6b861489.js.map",
     "453.d855a71b.chunk.js.map": "/static/js/453.d855a71b.chunk.js.map"
   },
   "entrypoints": [
     "static/css/main.61f6cf42.css",
-    "static/js/main.2e25398b.js"
+    "static/js/main.6b861489.js"
   ]
 }
diff --git a/frontend/build/index.html b/frontend/build/index.html
@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/matterbridge 32x32.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>Matterbridge</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.2e25398b.js"></script><link href="/static/css/main.61f6cf42.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/matterbridge 32x32.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>Matterbridge</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.6b861489.js"></script><link href="/static/css/main.61f6cf42.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
diff --git a/frontend/build/matterbridge 1250x1250.png b/frontend/build/matterbridge 1250x1250.png
diff --git a/frontend/build/matterbridge 32x32.png b/frontend/build/matterbridge 32x32.png
diff --git a/frontend/build/matterbridge 624x624.png b/frontend/build/matterbridge 624x624.png
diff --git a/frontend/build/matterbridge 64x64.png b/frontend/build/matterbridge 64x64.png
diff --git a/frontend/build/static/js/main.2e25398b.js.map b/frontend/build/static/js/main.2e25398b.js.map
diff --git a/frontend/build/static/js/main.2e25398b.js → frontend/build/static/js/main.6b861489.js b/frontend/build/static/js/main.2e25398b.js → frontend/build/static/js/main.6b861489.js
diff --git a/...ld/static/js/main.2e25398b.js.LICENSE.txt → ...ld/static/js/main.6b861489.js.LICENSE.txt b/...ld/static/js/main.2e25398b.js.LICENSE.txt → ...ld/static/js/main.6b861489.js.LICENSE.txt
diff --git a/frontend/build/static/js/main.6b861489.js.map b/frontend/build/static/js/main.6b861489.js.map
diff --git a/frontend/package.json b/frontend/package.json
@@ -1,48 +1,48 @@
-{
-  "name": "frontend",
-  "version": "0.8.4",
-  "private": true,
-  "dependencies": {
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.0",
-    "@mui/icons-material": "^5.15.13",
-    "@mui/material": "^5.15.13",
-    "@testing-library/jest-dom": "^5.17.0",
-    "@testing-library/react": "^13.4.0",
-    "@testing-library/user-event": "^13.5.0",
-    "qrcode.react": "^3.1.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.22.1",
-    "react-scripts": "5.0.1",
-    "react-table": "^7.8.0",
-    "web-vitals": "^2.1.4"
-  },
-  "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "devDependencies": {
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11"
-  }
-}
+{
+  "name": "frontend",
+  "version": "0.8.5",
+  "private": true,
+  "dependencies": {
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.0",
+    "@mui/icons-material": "^5.15.13",
+    "@mui/material": "^5.15.13",
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "qrcode.react": "^3.1.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.22.1",
+    "react-scripts": "5.0.1",
+    "react-table": "^7.8.0",
+    "web-vitals": "^2.1.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11"
+  }
+}
diff --git a/frontend/public/Matterbridge.jpg b/frontend/public/Matterbridge.jpg
diff --git a/frontend/public/matterbridge 1250x1250.png b/frontend/public/matterbridge 1250x1250.png
diff --git a/frontend/public/matterbridge 32x32.png b/frontend/public/matterbridge 32x32.png
diff --git a/frontend/public/matterbridge 624x624.png b/frontend/public/matterbridge 624x624.png
diff --git a/frontend/public/matterbridge 64x64.png b/frontend/public/matterbridge 64x64.png
diff --git a/frontend/src/App.js b/frontend/src/App.js
@@ -18,6 +18,7 @@ const AuthContext = createContext();
 // Create a provider component for the authentication state
 function AuthProvider({ children }) {
   const [loggedIn, setLoggedIn] = useState(false);
+  const [errorMessage, setErrorMessage] = useState('');
 
   const logIn = async password => {
     try {
@@ -33,7 +34,7 @@ function AuthProvider({ children }) {
         if (valid) {
           setLoggedIn(true);
         } else {
-          alert('Incorrect password.');
+          setErrorMessage('Incorrect password!');
         }
       } else {
         console.error('Failed to log in:', response.statusText);
@@ -44,7 +45,7 @@ function AuthProvider({ children }) {
   };
 
   return (
-    <AuthContext.Provider value={{ loggedIn, logIn }}>
+    <AuthContext.Provider value={{ loggedIn, logIn, errorMessage }}>
       {children}
     </AuthContext.Provider>
   );
@@ -53,7 +54,7 @@ function AuthProvider({ children }) {
 // Create a component for the login form
 function LoginForm() {
   const [password, setPassword] = useState('');
-  const { loggedIn, logIn } = useContext(AuthContext);
+  const { loggedIn, logIn, errorMessage  } = useContext(AuthContext);
 
   const handleSubmit = event => {
     event.preventDefault();
@@ -71,9 +72,10 @@ function LoginForm() {
   const formStyle = {
     display: 'flex',
     flexDirection: 'column',
-    maxWidth: '300px',
+    maxWidth: '400px',
     margin: '0 auto',
     padding: '20px',
+    gap: '20px',
     border: '1px solid #ccc',
     borderRadius: '10px',
     boxShadow: '2px 2px 5px rgba(0,0,0,0.3)',
@@ -84,6 +86,7 @@ function LoginForm() {
     margin: '10px 0',
     padding: '3px 3px',
     fontSize: '14px',
+    width: '230px',
   };
 
   if (loggedIn) {
@@ -104,15 +107,23 @@ function LoginForm() {
     return (
       <div style={containerStyle}>
         <form onSubmit={handleSubmit} style={formStyle}>
-          <h3>Welcome to Matterbridge</h3>
-          <input
-            type="password"
-            value={password}
-            onChange={e => setPassword(e.target.value)}
-            style={inputStyle}
-            placeholder="password"
-          />
-          <button type="submit">Log in</button>
+          <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', gap: '20px' }}>
+            <img src="matterbridge 64x64.png" alt="Matterbridge Logo" style={{ height: '64px', width: '64px' }} />
+            <h3>Welcome to Matterbridge</h3>
+          </div>
+          <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', gap: '20px' }}>
+            <input
+              type="password"
+              value={password}
+              onChange={e => setPassword(e.target.value)}
+              style={inputStyle}
+              placeholder="password"
+            />
+            <button type="submit">Log in</button>
+          </div>
+          <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', margin: 0, height: '30px' }}>
+            {errorMessage && <p style={{ color: 'red' }}>{errorMessage}</p>}
+          </div>
         </form>
       </div>
     );

diff --git a/frontend/src/components/Header.js b/frontend/src/components/Header.js
@@ -55,6 +55,7 @@ function Header() {
     setOpen(true);
     setTimeout(() => {
       setOpen(false);
+      window.location.reload();
     }, 20000);
   };
 
@@ -87,7 +88,7 @@ function Header() {
       </nav>
       <div className="header" style={{ flex: 1, display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}>
         <Tooltip title="Update matterbridge">
-          <Button disabled theme={theme} color="primary" variant="contained" size="small" endIcon={<SystemUpdateAltIcon />} style={{ color: '#ffffff' }} onClick={handleUpdateClick}>Update</Button>
+          <Button theme={theme} color="primary" variant="contained" size="small" endIcon={<SystemUpdateAltIcon />} style={{ color: '#ffffff' }} onClick={handleUpdateClick}>Update</Button>
         </Tooltip>        
         <Tooltip title="Restart matterbridge">
           <Button theme={theme} color="primary" variant="contained" size="small" endIcon={<RestartAltIcon />} style={{ color: '#ffffff' }} onClick={handleRestartClick}>Restart</Button>

diff --git a/frontend/src/components/Home.js b/frontend/src/components/Home.js
@@ -205,7 +205,7 @@ function Home() {
     // Function that sends the "addplugin" command
     const handleInstallPluginClick = () => {
       console.log('handleInstallPluginClick', pluginName);
-      sendCommandToMatterbridge('install', pluginName);
+      sendCommandToMatterbridge('installplugin', pluginName);
     };
 
     // Function that sends the "addplugin" command
@@ -237,11 +237,11 @@ function Home() {
         </div>
         <div style={{ display: 'flex', flexDirection: 'row', flex: '1 1 auto', alignItems: 'center', justifyContent: 'space-between', margin: '0px', padding: '10px', gap: '20px' }}>
           <Snackbar anchorOrigin={{vertical: 'bottom', horizontal: 'right'}} open={open} onClose={handleSnackClose} autoHideDuration={5000}>
-            <Alert onClose={handleSnackClose} severity="info" variant="filled" sx={{ width: '100%', bgcolor: '#4CAF50' }}>Restart needed!</Alert>
+            <Alert onClose={handleSnackClose} severity="info" variant="filled" sx={{ width: '100%', bgcolor: '#4CAF50' }}>Restart required</Alert>
           </Snackbar>
           <TextField value={pluginName} onChange={(event) => { setPluginName(event.target.value); }} size="small" id="plugin-name" label="Plugin name or plugin path" variant="outlined" fullWidth/>
           <Tooltip title="Install a plugin from npm">
-            <Button disabled onClick={handleInstallPluginClick} theme={theme} color="primary" variant='contained' size="small" aria-label="install" endIcon={<DownloadIcon />} style={{ color: '#ffffff', height: '30px' }}> Install</Button>
+            <Button onClick={handleInstallPluginClick} theme={theme} color="primary" variant='contained' size="small" aria-label="install" endIcon={<DownloadIcon />} style={{ color: '#ffffff', height: '30px' }}> Install</Button>
           </Tooltip>        
           <Tooltip title="Add an installed plugin">
             <Button onClick={handleAddPluginClick} theme={theme} color="primary" variant='contained' size="small" aria-label="add" endIcon={<AddIcon />} style={{ color: '#ffffff', height: '30px' }}> Add</Button>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/matterbridge 32x32.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>Matterbridge</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.2e25398b.js"></script><link href="/static/css/main.61f6cf42.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
		<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/matterbridge 32x32.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>Matterbridge</title><link rel="manifest" href="/manifest.json"/><script defer="defer" src="/static/js/main.6b861489.js"></script><link href="/static/css/main.61f6cf42.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>