From 3f64ecb644ca628c78beb6af294fee0f9c51a3fd Mon Sep 17 00:00:00 2001
From: Batman <montevechiol@gmail.com>
Date: Thu, 22 Apr 2021 02:53:01 -0300
Subject: [PATCH] Inventory tabs work

---
 src/views/inventory/InventoryView.tsx         | 12 ++++++----
 src/views/inventory/InventoryView.types.ts    |  8 +++++++
 .../tabs-content/InventoryTabsContentView.tsx | 22 +++++++++++++++++++
 .../InventoryTabsContentView.types.ts         |  2 ++
 .../badges/InventoryTabBadgesView.tsx         | 12 ++++++++++
 .../badges/InventoryTabBadgesView.types.ts    |  2 ++
 .../bots/InventoryTabBotsView.tsx             | 12 ++++++++++
 .../bots/InventoryTabBotsView.types.ts        |  2 ++
 .../furniture/InventoryTabFurnitureView.tsx   | 12 ++++++++++
 .../InventoryTabFurnitureView.types.ts        |  2 ++
 .../pets/InventoryTabPetsView.tsx             | 12 ++++++++++
 .../pets/InventoryTabPetsView.types.ts        |  2 ++
 .../InventoryTabsSelectorView.tsx}            |  4 ++--
 .../InventoryTabsSelectorView.types.ts        |  4 ++++
 .../tab/InventoryTabView.tsx                  |  0
 .../tab/InventoryTabView.types.ts             |  2 +-
 .../inventory/tabs/InventoryTabsView.types.ts |  4 ----
 17 files changed, 103 insertions(+), 11 deletions(-)
 create mode 100644 src/views/inventory/tabs-content/InventoryTabsContentView.tsx
 create mode 100644 src/views/inventory/tabs-content/InventoryTabsContentView.types.ts
 create mode 100644 src/views/inventory/tabs-content/badges/InventoryTabBadgesView.tsx
 create mode 100644 src/views/inventory/tabs-content/badges/InventoryTabBadgesView.types.ts
 create mode 100644 src/views/inventory/tabs-content/bots/InventoryTabBotsView.tsx
 create mode 100644 src/views/inventory/tabs-content/bots/InventoryTabBotsView.types.ts
 create mode 100644 src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.tsx
 create mode 100644 src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.types.ts
 create mode 100644 src/views/inventory/tabs-content/pets/InventoryTabPetsView.tsx
 create mode 100644 src/views/inventory/tabs-content/pets/InventoryTabPetsView.types.ts
 rename src/views/inventory/{tabs/InventoryTabsView.tsx => tabs-selector/InventoryTabsSelectorView.tsx} (72%)
 create mode 100644 src/views/inventory/tabs-selector/InventoryTabsSelectorView.types.ts
 rename src/views/inventory/{tabs => tabs-selector}/tab/InventoryTabView.tsx (100%)
 rename src/views/inventory/{tabs => tabs-selector}/tab/InventoryTabView.types.ts (70%)
 delete mode 100644 src/views/inventory/tabs/InventoryTabsView.types.ts

diff --git a/src/views/inventory/InventoryView.tsx b/src/views/inventory/InventoryView.tsx
index d2fe2994..6b9b0e59 100644
--- a/src/views/inventory/InventoryView.tsx
+++ b/src/views/inventory/InventoryView.tsx
@@ -4,8 +4,9 @@ import { DraggableWindow } from '../../hooks/draggable-window/DraggableWindow';
 import { useUiEvent } from '../../hooks/events/ui/ui-event';
 import { LocalizeText } from '../../utils/LocalizeText';
 import { InventoryMessageHandler } from './InventoryMessageHandler';
-import { IInventoryContext, InventoryViewProps } from './InventoryView.types';
-import { InventoryTabsView } from './tabs/InventoryTabsView';
+import { IInventoryContext, InventoryTabs, InventoryViewProps } from './InventoryView.types';
+import { InventoryTabsContentView } from './tabs-content/InventoryTabsContentView';
+import { InventoryTabsSelectorView } from './tabs-selector/InventoryTabsSelectorView';
 
 export const InventoryContext = React.createContext<IInventoryContext>(null);
 
@@ -13,7 +14,9 @@ export const InventoryView: FC<InventoryViewProps> = props =>
 {
     const [ isVisible, setIsVisible ]   = useState(false);
     const [ currentTab, setCurrentTab ] = useState<string>(null);
-    const [ tabs, setTabs ]             = useState<string[]>([ 'inventory.furni', 'inventory.bots', 'inventory.furni.tab.pets', 'inventory.badges' ]);
+    const [ tabs, setTabs ]             = useState<string[]>([ 
+        InventoryTabs.FURNITURE, InventoryTabs.BOTS, InventoryTabs.PETS, InventoryTabs.PETS
+     ]);
 
     useEffect(() => {
         setCurrentTab(tabs[0]);
@@ -51,7 +54,8 @@ export const InventoryView: FC<InventoryViewProps> = props =>
                             <i className="fas fa-times"></i>
                         </button>
                     </div>
-                    <InventoryTabsView tabs={ tabs } />
+                    <InventoryTabsSelectorView tabs={ tabs } />
+                    <InventoryTabsContentView />
                 </div>
             </DraggableWindow> }
         </InventoryContext.Provider>
diff --git a/src/views/inventory/InventoryView.types.ts b/src/views/inventory/InventoryView.types.ts
index df927897..c2e69860 100644
--- a/src/views/inventory/InventoryView.types.ts
+++ b/src/views/inventory/InventoryView.types.ts
@@ -6,3 +6,11 @@ export interface IInventoryContext
     currentTab: string;
     onSetCurrentTab: (tab: string) => void;
 }
+
+export class InventoryTabs
+{
+    public static readonly FURNITURE: string    = 'inventory.furni';
+    public static readonly BOTS: string         = 'inventory.bots';
+    public static readonly PETS: string         = 'inventory.furni.tab.pets';
+    public static readonly BADGES: string       = 'inventory.badges';
+}
diff --git a/src/views/inventory/tabs-content/InventoryTabsContentView.tsx b/src/views/inventory/tabs-content/InventoryTabsContentView.tsx
new file mode 100644
index 00000000..cc19ea70
--- /dev/null
+++ b/src/views/inventory/tabs-content/InventoryTabsContentView.tsx
@@ -0,0 +1,22 @@
+import { FC, useContext } from 'react';
+import { InventoryContext } from '../InventoryView';
+import { InventoryTabs } from '../InventoryView.types';
+import { InventoryTabBadgesView } from './badges/InventoryTabBadgesView';
+import { InventoryTabBotsView } from './bots/InventoryTabBotsView';
+import { InventoryTabFurnitureView } from './furniture/InventoryTabFurnitureView';
+import { InventoryTabsContentViewProps } from './InventoryTabsContentView.types';
+import { InventoryTabPetsView } from './pets/InventoryTabPetsView';
+
+export const InventoryTabsContentView: FC<InventoryTabsContentViewProps> = props =>
+{
+    const inventoryContext = useContext(InventoryContext);
+    
+    return (
+        <div className="p-3">
+            { inventoryContext && inventoryContext.currentTab && inventoryContext.currentTab === InventoryTabs.FURNITURE } <InventoryTabFurnitureView />
+            { inventoryContext && inventoryContext.currentTab && inventoryContext.currentTab === InventoryTabs.BOTS } <InventoryTabBotsView />
+            { inventoryContext && inventoryContext.currentTab && inventoryContext.currentTab === InventoryTabs.PETS } <InventoryTabPetsView />
+            { inventoryContext && inventoryContext.currentTab && inventoryContext.currentTab === InventoryTabs.BADGES } <InventoryTabBadgesView />
+        </div>
+    );
+}
diff --git a/src/views/inventory/tabs-content/InventoryTabsContentView.types.ts b/src/views/inventory/tabs-content/InventoryTabsContentView.types.ts
new file mode 100644
index 00000000..691c0edb
--- /dev/null
+++ b/src/views/inventory/tabs-content/InventoryTabsContentView.types.ts
@@ -0,0 +1,2 @@
+export interface InventoryTabsContentViewProps
+{}
diff --git a/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.tsx b/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.tsx
new file mode 100644
index 00000000..f80047c6
--- /dev/null
+++ b/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.tsx
@@ -0,0 +1,12 @@
+import { FC, useContext } from 'react';
+import { InventoryContext } from '../../InventoryView';
+import { InventoryTabBadgesViewProps } from './InventoryTabBadgesView.types';
+
+export const InventoryTabBadgesView: FC<InventoryTabBadgesViewProps> = props =>
+{
+    const inventoryContext = useContext(InventoryContext);
+
+    return (
+        <></>
+    );
+}
diff --git a/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.types.ts b/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.types.ts
new file mode 100644
index 00000000..8e739238
--- /dev/null
+++ b/src/views/inventory/tabs-content/badges/InventoryTabBadgesView.types.ts
@@ -0,0 +1,2 @@
+export interface InventoryTabBadgesViewProps
+{}
diff --git a/src/views/inventory/tabs-content/bots/InventoryTabBotsView.tsx b/src/views/inventory/tabs-content/bots/InventoryTabBotsView.tsx
new file mode 100644
index 00000000..9f7cc944
--- /dev/null
+++ b/src/views/inventory/tabs-content/bots/InventoryTabBotsView.tsx
@@ -0,0 +1,12 @@
+import { FC, useContext } from 'react';
+import { InventoryContext } from '../../InventoryView';
+import { InventoryTabBotsViewProps } from './InventoryTabBotsView.types';
+
+export const InventoryTabBotsView: FC<InventoryTabBotsViewProps> = props =>
+{
+    const inventoryContext = useContext(InventoryContext);
+
+    return (
+        <></>
+    );
+}
diff --git a/src/views/inventory/tabs-content/bots/InventoryTabBotsView.types.ts b/src/views/inventory/tabs-content/bots/InventoryTabBotsView.types.ts
new file mode 100644
index 00000000..38892a21
--- /dev/null
+++ b/src/views/inventory/tabs-content/bots/InventoryTabBotsView.types.ts
@@ -0,0 +1,2 @@
+export interface InventoryTabBotsViewProps
+{}
diff --git a/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.tsx b/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.tsx
new file mode 100644
index 00000000..250c8141
--- /dev/null
+++ b/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.tsx
@@ -0,0 +1,12 @@
+import { FC, useContext } from 'react';
+import { InventoryContext } from '../../InventoryView';
+import { InventoryTabFurnitureViewProps } from './InventoryTabFurnitureView.types';
+
+export const InventoryTabFurnitureView: FC<InventoryTabFurnitureViewProps> = props =>
+{
+    const inventoryContext = useContext(InventoryContext);
+
+    return (
+        <></>
+    );
+}
diff --git a/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.types.ts b/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.types.ts
new file mode 100644
index 00000000..e17988c4
--- /dev/null
+++ b/src/views/inventory/tabs-content/furniture/InventoryTabFurnitureView.types.ts
@@ -0,0 +1,2 @@
+export interface InventoryTabFurnitureViewProps
+{}
diff --git a/src/views/inventory/tabs-content/pets/InventoryTabPetsView.tsx b/src/views/inventory/tabs-content/pets/InventoryTabPetsView.tsx
new file mode 100644
index 00000000..beeb28de
--- /dev/null
+++ b/src/views/inventory/tabs-content/pets/InventoryTabPetsView.tsx
@@ -0,0 +1,12 @@
+import { FC, useContext } from 'react';
+import { InventoryContext } from '../../InventoryView';
+import { InventoryTabPetsViewProps } from './InventoryTabPetsView.types';
+
+export const InventoryTabPetsView: FC<InventoryTabPetsViewProps> = props =>
+{
+    const inventoryContext = useContext(InventoryContext);
+
+    return (
+        <></>
+    );
+}
diff --git a/src/views/inventory/tabs-content/pets/InventoryTabPetsView.types.ts b/src/views/inventory/tabs-content/pets/InventoryTabPetsView.types.ts
new file mode 100644
index 00000000..94be286b
--- /dev/null
+++ b/src/views/inventory/tabs-content/pets/InventoryTabPetsView.types.ts
@@ -0,0 +1,2 @@
+export interface InventoryTabPetsViewProps
+{}
diff --git a/src/views/inventory/tabs/InventoryTabsView.tsx b/src/views/inventory/tabs-selector/InventoryTabsSelectorView.tsx
similarity index 72%
rename from src/views/inventory/tabs/InventoryTabsView.tsx
rename to src/views/inventory/tabs-selector/InventoryTabsSelectorView.tsx
index 103bfeda..cb91f4e0 100644
--- a/src/views/inventory/tabs/InventoryTabsView.tsx
+++ b/src/views/inventory/tabs-selector/InventoryTabsSelectorView.tsx
@@ -1,8 +1,8 @@
 import { FC } from 'react';
-import { InventoryTabsViewProps } from './InventoryTabsView.types';
+import { InventoryTabsSelectorViewProps } from './InventoryTabsSelectorView.types';
 import { InventoryTabView } from './tab/InventoryTabView';
 
-export const InventoryTabsView: FC<InventoryTabsViewProps> = props =>
+export const InventoryTabsSelectorView: FC<InventoryTabsSelectorViewProps> = props =>
 {
     return (
         <div className="p-3">
diff --git a/src/views/inventory/tabs-selector/InventoryTabsSelectorView.types.ts b/src/views/inventory/tabs-selector/InventoryTabsSelectorView.types.ts
new file mode 100644
index 00000000..a5883422
--- /dev/null
+++ b/src/views/inventory/tabs-selector/InventoryTabsSelectorView.types.ts
@@ -0,0 +1,4 @@
+export interface InventoryTabsSelectorViewProps
+{
+    tabs: string[];
+}
diff --git a/src/views/inventory/tabs/tab/InventoryTabView.tsx b/src/views/inventory/tabs-selector/tab/InventoryTabView.tsx
similarity index 100%
rename from src/views/inventory/tabs/tab/InventoryTabView.tsx
rename to src/views/inventory/tabs-selector/tab/InventoryTabView.tsx
diff --git a/src/views/inventory/tabs/tab/InventoryTabView.types.ts b/src/views/inventory/tabs-selector/tab/InventoryTabView.types.ts
similarity index 70%
rename from src/views/inventory/tabs/tab/InventoryTabView.types.ts
rename to src/views/inventory/tabs-selector/tab/InventoryTabView.types.ts
index d8cdf704..8398b0b1 100644
--- a/src/views/inventory/tabs/tab/InventoryTabView.types.ts
+++ b/src/views/inventory/tabs-selector/tab/InventoryTabView.types.ts
@@ -1,4 +1,4 @@
 export interface InventoryTabViewProps
 {
-    tab: string;
+    tab?: string;
 }
diff --git a/src/views/inventory/tabs/InventoryTabsView.types.ts b/src/views/inventory/tabs/InventoryTabsView.types.ts
deleted file mode 100644
index 47a708cd..00000000
--- a/src/views/inventory/tabs/InventoryTabsView.types.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export interface InventoryTabsViewProps
-{
-    tabs: string[];
-}