Merge pull request #673 from kikeelectronico/refactor_front

Refactor front
kikeelectronico · Jul 27, 2024 · a5ee739 · a5ee739
2 parents cafdcf9 + 9b708d3
commit a5ee739
Show file tree

Hide file tree

Showing 28 changed files with 996 additions and 2,133 deletions.
diff --git a/front/src/App.css b/front/src/App.css
@@ -41,7 +41,7 @@
   margin-left: 20px;
 }
 
-@media only screen and (min-width: 1300px) {
+@media only screen and (min-width: 800px) {
   .App {
     text-align: center;
     height: 100%;
@@ -162,7 +162,7 @@
     margin-top: 20px;
     display: grid;
     grid-gap: 10px;
-    grid-template-columns: 250px 250px auto;
+    grid-template-columns: 300px 250px auto;
   }
 
   .three_table_cel {
@@ -289,7 +289,7 @@
   }
 }
 
-@media only screen and (max-width: 1300px) {
+@media only screen and (max-width: 800px) {
   .App {
     text-align: center;
     height: 100%;

diff --git a/front/src/App.js b/front/src/App.js
@@ -11,8 +11,6 @@ import Devices from './components/pages/Devices'
 import Editor from './components/pages/Editor'
 import Info from './components/pages/Info'
 import Connecting from './components/pages/Connecting'
-import Tasks from './components/pages/Tasks'
-import Manager from './components/pages/Manager'
 import Settings from './components/pages/Settings'
 import System from './components/pages/System'
 import Backup from './components/pages/Backup'
@@ -185,7 +183,6 @@ class App extends React.Component {
               <div className="menu" id="menu">
                 <div>
                   <MenuElement image="/menu/devices_icon.png" title="Devices" href="/devices"/>
-                  <MenuElement image="/menu/tasks_icon.png" title="Tasks" href="/tasks"/>
                   <MenuElement image="/menu/settings_icon.png" title="Settings" href="/settings"/>
                   <MenuElement image="/menu/status_icon.png" title="System" href="/system"/>
                   <MenuElement image="/menu/backup_icon.png" title="Backup" href="/backup"/>
@@ -218,9 +215,6 @@ class App extends React.Component {
                   <Route path="/devices/editor/:deviceId" element={<Editor/>}> </Route>
                   <Route path="/devices/info/:deviceId" element={<Info/>}> </Route> 
                   <Route path="/devices/connecting/:deviceId" element={<Connecting/>}> </Route>
-                  <Route exact={ true } path="/tasks" element={<Tasks/>}> </Route>
-                  <Route path="/tasks/manager/" element={<Manager/>}> </Route>
-                  <Route path="/tasks/manager/:taskId" element={<Manager/>}> </Route>
                   <Route path="/settings" element={<Settings/>}> </Route>
                   <Route path="/system" element={<System git={this.state.git} version={this.state.version}/>}>  </Route>
                   <Route path="/backup" element={<Backup/>}> </Route>

diff --git a/front/src/components/editor/Trait.js b/front/src/components/editor/Trait.js
@@ -39,26 +39,27 @@ const Trait = (props) => {
     }
 
     const renderAttrinutes = (trait) => {
-      if (trait === "action.devices.traits.ArmDisarm") return <ArmDisarm attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Brightness") return <Brightness attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   if (trait === "action.devices.traits.ArmDisarm") return <ArmDisarm attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else 
+      if (trait === "action.devices.traits.Brightness") return <Brightness attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.ColorSetting") return <ColorSetting attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Cook") return <Cook attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.Cook") return <Cook attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.EnergyStorage") return <EnergyStorage attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.FanSpeed") return <FanSpeed attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Fill") return <Fill attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.HumiditySetting") return <HumiditySetting attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Modes") return <Modes attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.Fill") return <Fill attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.HumiditySetting") return <HumiditySetting attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+      else if (trait === "action.devices.traits.Modes") return <Modes attributes={props.attributes} updateAttributes={props.updateAttributes} status={props.status} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.OccupancySensing") return <OccupancySensing attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.OnOff") return <OnOff attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/> 
       else if (trait === "action.devices.traits.OpenClose") return <OpenClose attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Rotation") return <Rotation attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.Rotation") return <Rotation attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.Scene") return <Scene attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
     //   else if (trait === "action.devices.traits.SensorState") return <SensorState attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.StartStop") return <StartStop attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.TemperatureControl") return <TemperatureControl attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.StartStop") return <StartStop attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.TemperatureControl") return <TemperatureControl attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
       else if (trait === "action.devices.traits.TemperatureSetting") return <TemperatureSetting attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Timer") return <Timer attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
-      else if (trait === "action.devices.traits.Toggles") return <Toggles attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+    //   else if (trait === "action.devices.traits.Timer") return <Timer attributes={props.attributes} updateAttributes={props.updateAttributes} updateStatus={props.updateStatus} ref={childRef}/>
+      else if (trait === "action.devices.traits.Toggles") return <Toggles attributes={props.attributes} updateAttributes={props.updateAttributes} status={props.status} updateStatus={props.updateStatus} ref={childRef}/>
   }
 
     return (

diff --git a/front/src/components/editor/traits/Brightness.js b/front/src/components/editor/traits/Brightness.js
@@ -30,7 +30,6 @@ const Brightness = forwardRef((props, ref) => {
   }))
 
   return (
-    <div>
       <div className="three_table_row">
         <div className="three_table_cel align_right">
           <i>commandOnlyBrightness</i>
@@ -44,13 +43,7 @@ const Brightness = forwardRef((props, ref) => {
             checked={commandOnlyBrightness}
           />
         </div>
-        <div className="three_table_cel">
-          <span className="attribute_advise">
-            Enable it if Homeware-LAN shouldn't inform Google Home about the brightness.
-          </span>
-        </div>
       </div>
-    </div>
   );
 
 })

diff --git a/front/src/components/editor/traits/ColorSetting.js b/front/src/components/editor/traits/ColorSetting.js
@@ -68,7 +68,7 @@ const ColorSetting = forwardRef((props, ref) => {
   }
 
   return (
-    <div>
+    <>
       <div className="three_table_row">
         <div className="three_table_cel align_right">
           <i>commandOnlyColorSetting</i>
@@ -82,9 +82,6 @@ const ColorSetting = forwardRef((props, ref) => {
             checked={commandOnlyColorSetting}
           />
         </div>
-        <div className="three_table_cel">
-          <span className="attribute_advise">Enable it if Homeware-LAN shouldn't inform Google Home about the color.</span>
-        </div>
       </div>
       <div className="three_table_row">
         <div className="three_table_cel align_right">
@@ -102,9 +99,6 @@ const ColorSetting = forwardRef((props, ref) => {
             <option value="hsv">HSV light</option>
           </select>
         </div>
-        <div className="three_table_cel">
-          <span className="attribute_advise">Select a color coding format.</span>
-        </div>
       </div> 
       {
         colorTemperatureRange ?
@@ -123,9 +117,6 @@ const ColorSetting = forwardRef((props, ref) => {
                   min="0" max="10000" className="int_input"
                 />
               </div>
-              <div className="three_table_cel">
-                <span className="attribute_advise">Minimum color temperature (in Kelvin) supported by the device.</span>
-              </div>
             </div>
             <div className="three_table_row">
               <div className="three_table_cel align_right">
@@ -141,16 +132,11 @@ const ColorSetting = forwardRef((props, ref) => {
                   min="0" max="10000" className="int_input"
                 />
               </div>
-              <div className="three_table_cel">
-                <span className="attribute_advise">Maximum color temperature (in Kelvin) supported by the device.</span>
-              </div>
             </div>
           </>
         : <></>
-      }
-
-
-    </div>
+      }      
+    </>
   );
 
 })

diff --git a/front/src/components/editor/traits/EnergyStorage.js b/front/src/components/editor/traits/EnergyStorage.js
@@ -42,7 +42,7 @@ const EnergyStorage = forwardRef((props, ref) => {
   }))
 
     return (
-      <div>
+      <>
         <div className="three_table_row">
           <div className="three_table_cel align_right">
             <i>Distance units</i>
@@ -63,9 +63,6 @@ const EnergyStorage = forwardRef((props, ref) => {
               <option value="MILES">Miles</option>
             </select>
           </div>
-          <div className="three_table_cel">
-            <span className="attribute_advise">Select the units of distance for remaining range if apply.</span>
-          </div>
         </div>
         <div className="three_table_row">
           <div className="three_table_cel align_right">
@@ -80,9 +77,6 @@ const EnergyStorage = forwardRef((props, ref) => {
               checked={queryOnlyEnergyStorage}
             />
           </div>
-          <div className="three_table_cel">
-            <span className="attribute_advise">Enable it if Google Home can't control the device, only read the state.</span>
-          </div>
         </div>
         <div className="three_table_row">
           <div className="three_table_cel align_right">
@@ -97,11 +91,8 @@ const EnergyStorage = forwardRef((props, ref) => {
               checked={isRechargeable}
             />
           </div>
-          <div className="three_table_cel">
-            <span className="attribute_advise">Enable it if the device is rechargeable.</span>
-          </div>
         </div>
-      </div>
+      </>
     )
 })