From 986472fef3d0f9da2982c8cdfb4bed305fae4b28 Mon Sep 17 00:00:00 2001
From: Kavin Venkatachalam
 <50441969+kavinvenkatachalam@users.noreply.github.com>
Date: Mon, 11 Apr 2022 16:59:17 +0530
Subject: [PATCH] Hide tabs in Tab widget (#2784)

---
 frontend/src/Editor/Components/Tabs.jsx      | 5 ++++-
 frontend/src/Editor/Components/components.js | 2 ++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Editor/Components/Tabs.jsx b/frontend/src/Editor/Components/Tabs.jsx
index caebcede17..ca0e3f29ea 100644
--- a/frontend/src/Editor/Components/Tabs.jsx
+++ b/frontend/src/Editor/Components/Tabs.jsx
@@ -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
diff --git a/frontend/src/Editor/Components/components.js b/frontend/src/Editor/Components/components.js
index 62b2702491..d0fb3a19d5 100644
--- a/frontend/src/Editor/Components/components.js
+++ b/frontend/src/Editor/Components/components.js
@@ -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: {