Merge branch 'staging_environment' of gitlab.com:brandx/bxt-app into staging_environment

src/bin/BinVisualizerV2.tsx

@@ -1434,6 +1434,7 @@ export default function BinVisualizer(props: Props) {
 
   const controls = () => {
     if (bin.settings.inventory?.empty === true) return null;
+    const canEdit = permissions ? permissions.includes(pond.Permission.PERMISSION_WRITE) : false;
     return (
       <Box
         height={1}
@@ -1447,12 +1448,13 @@ export default function BinVisualizer(props: Props) {
           <React.Fragment>
             <Box display="flex" height={isMobile ? 35 : 40} marginBottom={1}>
               <IconButton
+                disabled={!canEdit}
                 onClick={() => {
                   setGrainUpdate(true);
                 }}
                 style={{
                   margin: "auto",
-                  backgroundColor: "gold",
+                  backgroundColor: canEdit ? "gold" : "grey",
                   color: "black",
                   height: "100%",
                   width: isMobile ? 35 : 40
@@ -1468,6 +1470,7 @@ export default function BinVisualizer(props: Props) {
               alignContent="flex-end">
               {fillPercentage !== null && (
                 <Slider
+                  disabled={!canEdit}
                   orientation="vertical"
                   value={fillPercentage}
                   classes={{
@@ -1477,7 +1480,7 @@ export default function BinVisualizer(props: Props) {
                   //   thumb: isMobile ? classes.mobileSliderThumb : classes.sliderThumb,
                     valueLabel: classes.sliderValLabel,
                   }}
-                  style={{ height: "100%", color: sliderColour }}
+                  style={{ height: "100%", color: canEdit ? sliderColour : "gray" }}
                   min={0}
                   max={100}
                   valueLabelDisplay="auto"