Lint: no-unused-expressions (error) (#4197)

.eslintrc.js

@@ -77,6 +77,7 @@ module.exports = {
         "object-shorthand": "error",
         "prefer-template": "error",
         "template-curly-spacing": "error",
+        "no-unused-expressions": "error",
         "padding-line-between-statements": [
           "error",
           { "blankLine": "always", "prev": "*", "next": "return" },
@@ -139,6 +140,8 @@ module.exports = {
         "object-shorthand": "error",
         "prefer-template": "error",
         "template-curly-spacing": "error",
+        "no-unused-expressions": "off",
+        "@typescript-eslint/no-unused-expressions": "error",
         "padding-line-between-statements": [
           "error",
           { "blankLine": "always", "prev": "*", "next": "return" },
@@ -208,6 +211,8 @@ module.exports = {
         "object-shorthand": "error",
         "prefer-template": "error",
         "template-curly-spacing": "error",
+        "no-unused-expressions": "off",
+        "@typescript-eslint/no-unused-expressions": "error",
         "padding-line-between-statements": [
           "error",
           { "blankLine": "always", "prev": "*", "next": "return" },

src/common/getTSLoader.ts

@@ -23,20 +23,18 @@ import esbuild from "esbuild";
 
 /**
  * A function returning webpack ts/tsx loader
- * 
+ *
  * depends on env LENS_DEV_USE_ESBUILD_LOADER to use esbuild-loader (faster) or good-old ts-loader
- * 
- * @param testRegExp - the regex for webpack to conditional find the files 
+ *
+ * @param testRegExp - the regex for webpack to conditional find the files
  * @returns ts/tsx webpack loader configuration object
  */
 const getTSLoader = (
   testRegExp: RegExp, transpileOnly = true
 ) => {
-  const useEsbuildLoader = process.env.LENS_DEV_USE_ESBUILD_LOADER === "true";
+  if (process.env.LENS_DEV_USE_ESBUILD_LOADER === "true") {
+    console.info(`\n🚀 using esbuild-loader for ts(x)`);
 
-  useEsbuildLoader && console.info(`\n🚀 using esbuild-loader for ts(x)`);
-
-  if (useEsbuildLoader) {
     return {
       test: testRegExp,
       loader: "esbuild-loader",

src/renderer/components/+catalog/hotbar-toggle-menu-item.tsx

@@ -27,14 +27,17 @@ import type { CatalogEntity } from "../../api/catalog-entity";
 
 export function HotbarToggleMenuItem(props: { entity: CatalogEntity, addContent: ReactNode, removeContent: ReactNode }) {
   const store = HotbarStore.getInstance();
-  const add = () => store.addToHotbar(props.entity);
-  const remove = () => store.removeFromHotbar(props.entity.getId());
   const [itemInHotbar, setItemInHotbar] = useState(store.isAddedToActive(props.entity));
 
   return (
     <MenuItem onClick={() => {
-      itemInHotbar ? remove() : add();
-      setItemInHotbar(!itemInHotbar);
+      if (itemInHotbar) {
+        store.removeFromHotbar(props.entity.getId());
+        setItemInHotbar(false);
+      } else {
+        store.addToHotbar(props.entity);
+        setItemInHotbar(true);
+      }
     }}>
       {itemInHotbar ? props.removeContent : props.addContent }
     </MenuItem>

src/renderer/components/+preferences/editor.tsx

@@ -35,6 +35,7 @@ enum EditorLineNumbersStyles {
 }
 
 export const Editor = observer(() => {
+  const userStore = UserStore.getInstance();
 
   return (
     <section id="editor">
@@ -43,8 +44,8 @@ export const Editor = observer(() => {
         <FormSwitch
           control={
             <Switcher
-              checked={UserStore.getInstance().editorConfiguration.miniMap.enabled}
-              onChange={v => UserStore.getInstance().enableEditorMinimap(v.target.checked)}
+              checked={userStore.editorConfiguration.miniMap.enabled}
+              onChange={v => userStore.enableEditorMinimap(v.target.checked)}
               name="minimap"
             />
           }
@@ -55,8 +56,8 @@ export const Editor = observer(() => {
         <SubTitle title="Line numbers"/>
         <Select
           options={Object.entries(EditorLineNumbersStyles).map(entry => ({label: entry[1], value: entry[0]}))}
-          value={UserStore.getInstance().editorConfiguration?.lineNumbers}
-          onChange={({ value }: SelectOption) => UserStore.getInstance().setEditorLineNumbers(value)}
+          value={userStore.editorConfiguration?.lineNumbers}
+          onChange={({ value }: SelectOption) => userStore.setEditorLineNumbers(value)}
           themeName="lens"
         />
       </section>
@@ -67,11 +68,17 @@ export const Editor = observer(() => {
           min={1}
           max={10}
           validators={[isNumber]}
-          value={UserStore.getInstance().editorConfiguration.tabSize?.toString()}
-          onChange={(value) => {(Number(value) || value=="") && UserStore.getInstance().setEditorTabSize(Number(value));}}
+          value={userStore.editorConfiguration.tabSize?.toString()}
+          onChange={value => {
+            const n = Number(value);
+
+            if (!isNaN(n)) {
+              userStore.setEditorTabSize(n);
+            }
+          }}
         />
       </section>
     </section>
   );
 });
-    
+

src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx

@@ -118,12 +118,14 @@ export class DeploymentScaleDialog extends Component<Props> {
     }
   };
 
+  private readonly scaleMin = 0;
+
   desiredReplicasUp = () => {
-    this.desiredReplicas < this.scaleMax && this.desiredReplicas++;
+    this.desiredReplicas = Math.min(this.scaleMax, this.desiredReplicas + 1);
   };
 
   desiredReplicasDown = () => {
-    this.desiredReplicas > 0 && this.desiredReplicas--;
+    this.desiredReplicas = Math.max(this.scaleMin, this.desiredReplicas - 1);
   };
 
   renderContents() {

src/renderer/components/+workloads-pods/pod-container-env.tsx

@@ -40,30 +40,23 @@ interface Props {
 export const ContainerEnvironment = observer((props: Props) => {
   const { container: { env, envFrom }, namespace } = props;
 
-  useEffect(
-    () =>
-      autorun(() => {
-        env && env.forEach(variable => {
-          const { valueFrom } = variable;
+  useEffect( () => autorun(() => {
+    for (const { valueFrom } of env ?? []) {
+      if (valueFrom?.configMapKeyRef) {
+        configMapsStore.load({ name: valueFrom.configMapKeyRef.name, namespace });
+      }
+    }
 
-          if (valueFrom && valueFrom.configMapKeyRef) {
-            configMapsStore.load({ name: valueFrom.configMapKeyRef.name, namespace });
-          }
-        });
-        envFrom && envFrom.forEach(item => {
-          const { configMapRef, secretRef } = item;
+    for (const { configMapRef, secretRef } of envFrom ?? []) {
+      if (secretRef?.name) {
+        secretsStore.load({ name: secretRef.name, namespace });
+      }
 
-          if (secretRef && secretRef.name) {
-            secretsStore.load({ name: secretRef.name, namespace });
-          }
-
-          if (configMapRef && configMapRef.name) {
-            configMapsStore.load({ name: configMapRef.name, namespace });
-          }
-        });
-      }),
-    []
-  );
+      if (configMapRef?.name) {
+        configMapsStore.load({ name: configMapRef.name, namespace });
+      }
+    }
+  }), []);
 
   const renderEnv = () => {
     const orderedEnv = _.sortBy(env, "name");

src/renderer/components/+workloads-replicasets/replicaset-scale-dialog.tsx

@@ -118,12 +118,14 @@ export class ReplicaSetScaleDialog extends Component<Props> {
     }
   };
 
+  private readonly scaleMin = 0;
+
   desiredReplicasUp = () => {
-    this.desiredReplicas < this.scaleMax && this.desiredReplicas++;
+    this.desiredReplicas = Math.min(this.scaleMax, this.desiredReplicas + 1);
   };
 
   desiredReplicasDown = () => {
-    this.desiredReplicas > 0 && this.desiredReplicas--;
+    this.desiredReplicas = Math.max(this.scaleMin, this.desiredReplicas - 1);
   };
 
   renderContents() {

src/renderer/components/+workloads-statefulsets/statefulset-scale-dialog.tsx

@@ -117,12 +117,14 @@ export class StatefulSetScaleDialog extends Component<Props> {
     }
   };
 
+  private readonly scaleMin = 0;
+
   desiredReplicasUp = () => {
-    this.desiredReplicas < this.scaleMax && this.desiredReplicas++;
+    this.desiredReplicas = Math.min(this.scaleMax, this.desiredReplicas + 1);
   };
 
   desiredReplicasDown = () => {
-    this.desiredReplicas > 0 && this.desiredReplicas--;
+    this.desiredReplicas = Math.max(this.scaleMin, this.desiredReplicas - 1);
   };
 
   renderContents() {

src/renderer/components/menu/menu.tsx

@@ -90,6 +90,10 @@ export class Menu extends React.Component<MenuProps, State> {
     return !!this.props.isOpen;
   }
 
+  get isClosed() {
+    return !this.isOpen;
+  }
+
   componentDidMount() {
     if (!this.props.usePortal) {
       const parent = this.elem.parentElement;
@@ -202,19 +206,32 @@ export class Menu extends React.Component<MenuProps, State> {
   };
 
   open() {
-    if (this.isOpen) return;
+    if (this.isOpen) {
+      return;
+    }
+
     this.props.open();
     this.refreshPosition();
-    if (this.props.autoFocus) this.focusNextItem();
+
+    if (this.props.autoFocus) {
+      this.focusNextItem();
+    }
   }
 
   close() {
-    if (!this.isOpen) return;
+    if (this.isClosed) {
+      return;
+    }
+
     this.props.close();
   }
 
   toggle() {
-    this.isOpen ? this.close() : this.open();
+    if (this.isOpen) {
+      this.close();
+    } else {
+      this.open();
+    }
   }
 
   onKeyDown(evt: KeyboardEvent) {