Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-05 22:38:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

added default value in the toggle widget (#3059)

Browse source 
* added default value in the toggle widget

* make sure existing apps do not get crashed if they don't have default value prop

* removed unwanted code

* changing defaultValue prop display name to Default Status

* added value key in exposedVariables prop
This commit is contained in:
Manish Kushare 2022-05-24 03:45:03 +05:30 committed by GitHub
parent d6b941227e
commit 57da2b640c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
frontend/src/Editor/Components/Toggle.jsx
View file

@ -1,5 +1,4 @@
import React, { useEffect } from 'react';
class Switch extends React.Component {
render() {
const { on, onClick, onChange, disabledState, color } = this.props;
@ -24,7 +23,9 @@ class Switch extends React.Component {
}
export const ToggleSwitch = ({ height, properties, styles, fireEvent, setExposedVariable }) => {
const [on, setOn] = React.useState(false);
// definition props
const defaultValue = properties.defaultValue ?? false;
const [on, setOn] = React.useState(defaultValue);
const label = properties.label;
const { visibility, disabledState, toggleSwitchColor, textColor } = styles;
@ -37,10 +38,11 @@ export const ToggleSwitch = ({ height, properties, styles, fireEvent, setExposed
// Exposing the initially set false value once on load
useEffect(() => {
console.log('shashi');
setExposedVariable('value', false);
setExposedVariable('value', defaultValue);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
setOn(defaultValue);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [defaultValue]);
const toggle = () => setOn(!on);

2
frontend/src/Editor/Components/components.js
View file

@ -618,6 +618,7 @@ export const componentTypes = [
},
properties: {
label: { type: 'code', displayName: 'Label' },
defaultValue: { type: 'toggle', displayName: 'Default Status' },
},
events: {
onChange: { displayName: 'On change' },
@ -638,6 +639,7 @@ export const componentTypes = [
},
properties: {
label: { value: 'Toggle label' },
defaultValue: { value: '{{false}}' },
},
events: [],
styles: {