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

Hide tabs in Tab widget (#2784)

Browse source
This commit is contained in:
Kavin Venkatachalam 2022-04-11 16:59:17 +05:30 committed by GitHub
parent 26203cfaf9
commit 986472fef3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
frontend/src/Editor/Components/Tabs.jsx
View file

@ -21,6 +21,7 @@ export const Tabs = function Tabs({
const tabs = component.definition.properties?.tabs?.value ?? [];
let parsedTabs = tabs;
parsedTabs = resolveWidgetFieldValue(parsedTabs, currentState);
const hideTabs = component.definition.properties?.hideTabs?.value ?? false;
// set index as id if id is not provided
parsedTabs = parsedTabs.map((parsedTab, index) => ({ ...parsedTab, id: parsedTab.id ? parsedTab.id : index }));
@ -37,6 +38,8 @@ export const Tabs = function Tabs({
const parsedDisabledState =
typeof disabledState !== 'boolean' ? resolveWidgetFieldValue(disabledState, currentState) : disabledState;
const parsedHideTabs = typeof hideTabs !== 'boolean' ? resolveWidgetFieldValue(hideTabs, currentState) : hideTabs;
let parsedWidgetVisibility = widgetVisibility;
try {
@ -64,7 +67,7 @@ export const Tabs = function Tabs({
return (
<div data-disabled={parsedDisabledState} className="jet-tabs card" style={computedStyles}>
<ul className="nav nav-tabs" data-bs-toggle="tabs">
<ul className="nav nav-tabs" data-bs-toggle="tabs" style={{ display: parsedHideTabs && 'none' }}>
{parsedTabs.map((tab) => (
<li className="nav-item" onClick={() => setCurrentTab(tab.id)} key={tab.id}>
<a

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

@ -1493,6 +1493,7 @@ export const componentTypes = [
properties: {
tabs: { type: 'code', displayName: 'Tabs' },
defaultTab: { type: 'code', displayName: 'Default tab' },
hideTabs: { type: 'toggle', displayName: 'Hide Tabs' },
},
events: {},
styles: {
@ -1512,6 +1513,7 @@ export const componentTypes = [
"{{[ \n\t\t{ title: 'Home', id: '0' }, \n\t\t{ title: 'Profile', id: '1' }, \n\t\t{ title: 'Settings', id: '2' } \n ]}}",
},
defaultTab: { value: '0' },
hideTabs: { value: false },
},
events: [],
styles: {