refactored code

Author: darshvaghela

dashboard/src/components/EnvComponents/Features.tsx

@@ -20,7 +20,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_LOGIN_PAGE}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -33,7 +33,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_EMAIL_VERIFICATION}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -46,7 +46,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_MAGIC_LINK_LOGIN}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -59,7 +59,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_BASIC_AUTHENTICATION}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -72,7 +72,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_SIGN_UP}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -85,7 +85,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_STRONG_PASSWORD}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -102,7 +102,7 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.DISABLE_MULTI_FACTOR_AUTHENTICATION}
-							is_Disable={true}
+							hasReversedValue
 						/>
 					</Flex>
 				</Flex>
@@ -121,7 +121,6 @@ const Features = ({ variables, setVariables }: any) => {
 							variables={variables}
 							setVariables={setVariables}
 							inputType={SwitchInputType.ENFORCE_MULTI_FACTOR_AUTHENTICATION}
-							is_Disable={false}
 						/>
 					</Flex>
 				</Flex>

dashboard/src/components/InputField.tsx

@@ -48,7 +48,8 @@ const InputField = ({
 	fieldVisibility,
 	setFieldVisibility,
 	availableRoles,
-	is_Disable,
+	// This prop is added to improve the user experience for the boolean ENV variable having `DISABLE_` prefix, as those values need to be considered in inverted form.
+	hasReversedValue,
 	...downshiftProps
 }: any) => {
 	const props = {
@@ -399,7 +400,9 @@ const InputField = ({
 				</Text>
 				<Switch
 					size="md"
-					isChecked={is_Disable ? !variables[inputType] : variables[inputType]}
+					isChecked={
+						hasReversedValue ? !variables[inputType] : variables[inputType]
+					}
 					onChange={() => {
 						setVariables({
 							...variables,