Merge branch 'hybrid_inventory_control' into staging_environment

src/pages/APIDocs.tsx

@@ -24,8 +24,7 @@ const useStyles = makeStyles((theme: Theme) => ({
     },
     drawer: {
       width: drawerWidth,
-      flexShrink: 0,
-      zIndex: 10
+      zIndex: "10 !important"
     },
     drawerPaper: {
       width: drawerWidth

src/pages/Bin.tsx

@@ -67,6 +67,7 @@ import { useNavigate, useParams } from "react-router-dom";
 import { Controller } from "models/Controller";
 import TaskViewer from "tasks/TaskViewer";
 import ButtonGroup from "common/ButtonGroup";
+import BinTransactions from "bin/BinTransactions";
 
 interface TabPanelProps {
   children?: React.ReactNode;
@@ -195,7 +196,7 @@ export default function Bin(props: Props) {
   const [heaters, setHeaters] = useState<Controller[]>([]);
   const [fans, setFans] = useState<Controller[]>([]);
   const [detail, setDetail] = useState<
-    "inventory" | "sensors" | "analytics" | "presets" | "alerts"
+    "inventory" | "sensors" | "analytics" | "presets" | "alerts" | "transactions"
   >("inventory");
   const [mobileTab, setMobileTab] = useState(0);
   const componentAPI = useComponentAPI();
@@ -886,6 +887,10 @@ export default function Bin(props: Props) {
                   {
                     title: "Presets",
                     function: () => setDetail("presets")
+                  },
+                  {
+                    title: "Transactions",
+                    function: () => setDetail("transactions")
                   }
                 ]}
               />
@@ -963,6 +968,9 @@ export default function Bin(props: Props) {
                 compositionNameMap={compositionNameMap}
               />
             )}
+            {detail === "transactions" &&
+              <BinTransactions bin={bin} permissions={permissions} refresh={refresh}/>
+            }
           </Grid>
         </Grid>
       </Card>
@@ -992,8 +1000,9 @@ export default function Bin(props: Props) {
           <Tab label="Inventory" style={{ fontWeight: mobileTab === 1 ? 650 : 500 }} />
           <Tab label="Sensors" style={{ fontWeight: mobileTab === 2 ? 650 : 500 }} />
           <Tab label="Analysis" style={{ fontWeight: mobileTab === 3 ? 650 : 500 }} />
-          <Tab label="Alerts" style={{ fontWeight: mobileTab === 3 ? 650 : 500 }} />
-          <Tab label="Presets" style={{ fontWeight: mobileTab === 3 ? 650 : 500 }} />
+          <Tab label="Alerts" style={{ fontWeight: mobileTab === 4 ? 650 : 500 }} />
+          <Tab label="Presets" style={{ fontWeight: mobileTab === 5 ? 650 : 500 }} />
+          <Tab label="Transactions" style={{ fontWeight: mobileTab === 6 ? 650 : 500 }} />
         </Tabs>
         <TabPanelMine value={mobileTab} index={0}>
           {overview()}
@@ -1080,6 +1089,9 @@ export default function Bin(props: Props) {
             }}
           />
         </TabPanelMine>
+        <TabPanelMine value={mobileTab} index={6}>
+          <BinTransactions bin={bin} permissions={permissions} refresh={refresh}/>
+        </TabPanelMine>
       </Card>
     );
   };

src/pages/Contracts.tsx

@@ -38,7 +38,6 @@ export default function Contracts() {
           as
         )
         .then(resp => {
-          console.log(resp)
           let contracts: Contract[] = [];
           let contractPermissions: Map<string, pond.Permission[]> = new Map();
           resp.data.contracts.forEach(contract => {