From 8d42d404338ae3a26506a769892fd7c8bd44ae61 Mon Sep 17 00:00:00 2001
From: Jari Kolehmainen <jari.kolehmainen@gmail.com>
Date: Tue, 20 Apr 2021 09:09:13 +0300
Subject: [PATCH] fix initial hotbar not showing (#2551)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
---
 src/common/__tests__/hotbar-store.test.ts     | 20 +++++++++++++++++++
 src/common/hotbar-store.ts                    | 12 +++++++----
 .../components/hotbar/hotbar-menu.tsx         | 14 ++++++++-----
 3 files changed, 37 insertions(+), 9 deletions(-)
 create mode 100644 src/common/__tests__/hotbar-store.test.ts

diff --git a/src/common/__tests__/hotbar-store.test.ts b/src/common/__tests__/hotbar-store.test.ts
new file mode 100644
index 0000000000..40f38416c2
--- /dev/null
+++ b/src/common/__tests__/hotbar-store.test.ts
@@ -0,0 +1,20 @@
+import mockFs from "mock-fs";
+import { HotbarStore, hotbarStore } from "../hotbar-store";
+
+describe("HotbarStore", () => {
+  beforeEach(() => {
+    HotbarStore.resetInstance();
+    mockFs({ tmp: { "lens-hotbar-store.json": "{}" } });
+  });
+
+  afterEach(() => {
+    mockFs.restore();
+  });
+
+  describe("load", () => {
+    it("loads one hotbar by default", () => {
+      hotbarStore.load();
+      expect(hotbarStore.hotbars.length).toEqual(1);
+    });
+  });
+});
diff --git a/src/common/hotbar-store.ts b/src/common/hotbar-store.ts
index 42cdc0a8b1..aba7c69bc1 100644
--- a/src/common/hotbar-store.ts
+++ b/src/common/hotbar-store.ts
@@ -35,10 +35,14 @@ export class HotbarStore extends BaseStore<HotbarStoreModel> {
   }
 
   @action protected async fromStore(data: Partial<HotbarStoreModel> = {}) {
-    this.hotbars = data.hotbars || [{
-      name: "default",
-      items: []
-    }];
+    if (data.hotbars?.length === 0) {
+      this.hotbars = [{
+        name: "default",
+        items: []
+      }];
+    } else {
+      this.hotbars = data.hotbars;
+    }
   }
 
   getByName(name: string) {
diff --git a/src/renderer/components/hotbar/hotbar-menu.tsx b/src/renderer/components/hotbar/hotbar-menu.tsx
index 9a2b8de484..05a95c606c 100644
--- a/src/renderer/components/hotbar/hotbar-menu.tsx
+++ b/src/renderer/components/hotbar/hotbar-menu.tsx
@@ -14,20 +14,24 @@ interface Props {
 
 @observer
 export class HotbarMenu extends React.Component<Props> {
-  render() {
-    const { className } = this.props;
+
+  get hotbarItems() {
     const hotbar = hotbarStore.getByName("default"); // FIXME
 
     if (!hotbar) {
-      return null;
+      return [];
     }
 
-    const items = hotbar.items.map((item) => catalogEntityRegistry.items.find((entity) => entity.metadata.uid === item.entity.uid)).filter(Boolean);
+    return hotbar.items.map((item) => catalogEntityRegistry.items.find((entity) => entity.metadata.uid === item.entity.uid)).filter(Boolean);
+  }
+
+  render() {
+    const { className } = this.props;
 
     return (
       <div className={cssNames("HotbarMenu flex column", className)}>
         <div className="items flex column gaps">
-          {items.map((entity, index) => {
+          {this.hotbarItems.map((entity, index) => {
             return (
               <HotbarIcon
                 key={index}