Topbar history buttons (#3696)

* HistoryStore initial draft

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Adding history icons

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Jump history using electron methods

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using 1 topbar component for all views

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Add Catalog title to sidebar

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Show cluster name in sidebar

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Updating topbar tests

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fixing Welcome tests

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Removing padding for external topbar items

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix cluster name prop

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using material icons for history buttons

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/+catalog/catalog-menu.module.css

@@ -27,4 +27,9 @@
   @apply uppercase font-bold;
   color: var(--textColorAccent);
   font-size: small;
+}
+
+.catalog {
+  @apply p-5 font-bold text-2xl;
+  color: var(--textColorAccent);
 }

src/renderer/components/+catalog/catalog-menu.tsx

@@ -58,6 +58,7 @@ export function CatalogMenu(props: Props) {
     // Overwrite Material UI styles with injectFirst https://material-ui.com/guides/interoperability/#controlling-priority-4
     <StylesProvider injectFirst>
       <div className="flex flex-col w-full">
+        <div className={styles.catalog}>Catalog</div>
         <TreeView
           defaultExpanded={["catalog"]}
           defaultCollapseIcon={<Icon material="expand_more"/>}

src/renderer/components/+catalog/catalog.tsx

@@ -43,7 +43,7 @@ import { catalogURL, CatalogViewRouteParam } from "../../../common/routes";
 import { CatalogMenu } from "./catalog-menu";
 import { HotbarIcon } from "../hotbar/hotbar-icon";
 import { RenderDelay } from "../render-delay/render-delay";
-import { CatalogTopbar } from "../cluster-manager/catalog-topbar";
+import { TopBar } from "../layout/topbar";
 
 export const previousActiveTab = createAppStorage("catalog-previous-active-tab", "");
 
@@ -247,7 +247,7 @@ export class Catalog extends React.Component<Props> {
 
     return (
       <>
-        <CatalogTopbar/>
+        <TopBar/>
         <MainLayout sidebar={this.renderNavigation()}>
           <div className="p-6 h-full">
             { this.renderList() }