From aa0878e372e2a1458ab0e2f2bfe592c45094e280 Mon Sep 17 00:00:00 2001
From: Alexander Polyankin <alexander.polyankin@metabase.com>
Date: Fri, 1 Apr 2022 21:00:25 +0300
Subject: [PATCH] The skeleton of the new homepage (#21355)
---
.../metabase-enterprise/whitelabel/index.js | 8 +-
frontend/src/metabase-types/api/activity.ts | 8 +
frontend/src/metabase-types/api/index.ts | 1 +
.../src/metabase-types/api/mocks/activity.ts | 16 ++
.../src/metabase-types/api/mocks/index.ts | 1 +
.../auth/containers/AuthLayout/AuthLayout.tsx | 5 +-
.../src/metabase/components/MetabotLogo.jsx | 9 -
.../src/metabase/components/MetabotLogo.tsx | 23 +++
frontend/src/metabase/entities/recents.js | 33 +++-
.../src/metabase/home/homepage/actions.ts | 37 ----
.../src/metabase/home/homepage/analytics.ts | 22 ---
.../CollectionSection.styled.tsx | 45 -----
.../CollectionSection/CollectionSection.tsx | 77 --------
.../CollectionSection.unit.spec.tsx | 41 ----
.../components/CollectionSection/index.ts | 1 -
.../DatabaseSection.styled.tsx | 84 ---------
.../DatabaseSection/DatabaseSection.tsx | 106 -----------
.../DatabaseSection.unit.spec.tsx | 94 ----------
.../components/DatabaseSection/index.ts | 1 -
.../GreetingSection.styled.tsx | 11 --
.../GreetingSection/GreetingSection.tsx | 34 ----
.../GreetingSection.unit.spec.tsx | 14 --
.../components/GreetingSection/index.ts | 1 -
.../components/HomeCard/HomeCard.styled.tsx | 15 ++
.../homepage/components/HomeCard/HomeCard.tsx | 22 +++
.../homepage/components/HomeCard/index.ts | 1 +
.../components/HomeContent/HomeContent.tsx | 25 +++
.../homepage/components/HomeContent/index.ts | 1 +
.../HomeGreeting/HomeGreeting.styled.tsx | 24 +++
.../components/HomeGreeting/HomeGreeting.tsx | 42 +++++
.../homepage/components/HomeGreeting/index.ts | 1 +
.../HomeLayout/HomeLayout.styled.tsx | 33 ++++
.../components/HomeLayout/HomeLayout.tsx | 19 ++
.../homepage/components/HomeLayout/index.ts | 1 +
.../homepage/components/HomePage/HomePage.tsx | 24 +++
.../homepage/components/HomePage/index.ts | 1 +
.../components/Homepage/Homepage.styled.tsx | 17 --
.../homepage/components/Homepage/Homepage.tsx | 119 ------------
.../homepage/components/Homepage/index.ts | 1 -
.../RecentSection/RecentSection.styled.tsx | 39 ++++
.../RecentSection/RecentSection.tsx | 34 ++++
.../components/RecentSection/index.ts | 1 +
.../components/Section/Section.styled.tsx | 39 ----
.../home/homepage/components/Section/index.ts | 6 -
.../StartSection/StartSection.styled.tsx | 123 ------------
.../components/StartSection/StartSection.tsx | 168 -----------------
.../StartSection/StartSection.unit.spec.tsx | 172 -----------------
.../homepage/components/StartSection/index.ts | 1 -
.../SyncingSection/SyncingSection.tsx | 94 ----------
.../SyncingSection.unit.spec.tsx | 80 --------
.../XraySection/XraySection.styled.tsx | 87 ++++-----
.../components/XraySection/XraySection.tsx | 176 ++++++------------
.../XraySection/XraySection.unit.spec.tsx | 88 ---------
.../containers/HomeContent/HomeContent.tsx | 9 +
.../homepage/containers/HomeContent/index.ts | 1 +
.../containers/HomeGreeting/HomeGreeting.tsx | 12 ++
.../homepage/containers/HomeGreeting/index.ts | 1 +
.../containers/HomeLayout/HomeLayout.tsx | 10 +
.../homepage/containers/HomeLayout/index.ts | 1 +
.../homepage/containers/HomePage/HomePage.tsx | 9 +
.../homepage/containers/HomePage/index.ts | 1 +
.../containers/HomepageApp/HomepageApp.tsx | 86 ---------
.../homepage/containers/HomepageApp/index.ts | 1 -
.../RecentSection/RecentSection.tsx | 4 +
.../containers/RecentSection/index.ts | 1 +
.../containers/XraySection/XraySection.tsx | 33 ++++
.../homepage/containers/XraySection/index.ts | 1 +
.../src/metabase/home/homepage/selectors.ts | 47 -----
.../homepage/utils/database-candidates.ts | 20 --
frontend/src/metabase/lib/greeting.js | 49 -----
frontend/src/metabase/plugins/index.ts | 6 +-
frontend/src/metabase/routes.jsx | 4 +-
.../onboarding/urls.cy.spec.js | 3 +-
.../collections/collections.cy.spec.js | 11 +-
.../collections/permissions.cy.spec.js | 9 -
.../dashboard-filters/parameters.cy.spec.js | 4 +-
.../scenarios/dashboard/x-rays.cy.spec.js | 17 --
.../auth/forgot_password.cy.spec.js | 2 +-
.../onboarding/home/activity-page.cy.spec.js | 1 -
.../onboarding/home/homepage.cy.spec.js | 159 ----------------
.../scenarios/onboarding/urls.cy.spec.js | 12 +-
.../smoketest/admin_setup.cy.spec.js | 53 +++---
resources/frontend_client/app/img/bridge.svg | 1 +
src/metabase/automagic_dashboards/core.clj | 2 +-
84 files changed, 595 insertions(+), 2101 deletions(-)
create mode 100644 frontend/src/metabase-types/api/activity.ts
create mode 100644 frontend/src/metabase-types/api/mocks/activity.ts
delete mode 100644 frontend/src/metabase/components/MetabotLogo.jsx
create mode 100644 frontend/src/metabase/components/MetabotLogo.tsx
delete mode 100644 frontend/src/metabase/home/homepage/actions.ts
delete mode 100644 frontend/src/metabase/home/homepage/analytics.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.unit.spec.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/CollectionSection/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.unit.spec.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/DatabaseSection/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.unit.spec.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/GreetingSection/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.styled.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeCard/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/HomeContent/HomeContent.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeContent/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.styled.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeGreeting/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.styled.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomeLayout/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/HomePage/HomePage.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/HomePage/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/Homepage/Homepage.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/Homepage/Homepage.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/Homepage/index.ts
create mode 100644 frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.styled.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.tsx
create mode 100644 frontend/src/metabase/home/homepage/components/RecentSection/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/Section/Section.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/Section/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/StartSection/StartSection.styled.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/StartSection/StartSection.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/StartSection/StartSection.unit.spec.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/StartSection/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.unit.spec.tsx
delete mode 100644 frontend/src/metabase/home/homepage/components/XraySection/XraySection.unit.spec.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeContent/HomeContent.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeContent/index.ts
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeGreeting/HomeGreeting.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeGreeting/index.ts
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeLayout/HomeLayout.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/HomeLayout/index.ts
create mode 100644 frontend/src/metabase/home/homepage/containers/HomePage/HomePage.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/HomePage/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/containers/HomepageApp/HomepageApp.tsx
delete mode 100644 frontend/src/metabase/home/homepage/containers/HomepageApp/index.ts
create mode 100644 frontend/src/metabase/home/homepage/containers/RecentSection/RecentSection.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/RecentSection/index.ts
create mode 100644 frontend/src/metabase/home/homepage/containers/XraySection/XraySection.tsx
create mode 100644 frontend/src/metabase/home/homepage/containers/XraySection/index.ts
delete mode 100644 frontend/src/metabase/home/homepage/selectors.ts
delete mode 100644 frontend/src/metabase/home/homepage/utils/database-candidates.ts
delete mode 100644 frontend/src/metabase/lib/greeting.js
create mode 100644 resources/frontend_client/app/img/bridge.svg
diff --git a/enterprise/frontend/src/metabase-enterprise/whitelabel/index.js b/enterprise/frontend/src/metabase-enterprise/whitelabel/index.js
index 716d620aed1..11724aa74a2 100644
--- a/enterprise/frontend/src/metabase-enterprise/whitelabel/index.js
+++ b/enterprise/frontend/src/metabase-enterprise/whitelabel/index.js
@@ -75,7 +75,7 @@ if (hasPremiumFeature("whitelabel")) {
}
// these selectors control whitelabeling UI
-PLUGIN_SELECTORS.getShowAuthScene = (state, props) =>
- !getIsWhitelabeled(state, props);
-PLUGIN_SELECTORS.getLogoBackgroundClass = (state, props) =>
- getHasCustomLogo(state, props) ? "bg-brand" : "bg-white";
+PLUGIN_SELECTORS.getShowBrandLogo = state => !getIsWhitelabeled(state);
+PLUGIN_SELECTORS.getShowBrandScene = state => !getIsWhitelabeled(state);
+PLUGIN_SELECTORS.getLogoBackgroundClass = state =>
+ getHasCustomLogo(state) ? "bg-brand" : "bg-white";
diff --git a/frontend/src/metabase-types/api/activity.ts b/frontend/src/metabase-types/api/activity.ts
new file mode 100644
index 00000000000..eaba6530c71
--- /dev/null
+++ b/frontend/src/metabase-types/api/activity.ts
@@ -0,0 +1,8 @@
+export interface RecentView {
+ model: string;
+ model_object: RecentModelObject;
+}
+
+export interface RecentModelObject {
+ name: string;
+}
diff --git a/frontend/src/metabase-types/api/index.ts b/frontend/src/metabase-types/api/index.ts
index 734160e317f..a1e756743ef 100644
--- a/frontend/src/metabase-types/api/index.ts
+++ b/frontend/src/metabase-types/api/index.ts
@@ -1,3 +1,4 @@
+export * from "./activity";
export * from "./automagic-dashboards";
export * from "./bookmark";
export * from "./collection";
diff --git a/frontend/src/metabase-types/api/mocks/activity.ts b/frontend/src/metabase-types/api/mocks/activity.ts
new file mode 100644
index 00000000000..20430668249
--- /dev/null
+++ b/frontend/src/metabase-types/api/mocks/activity.ts
@@ -0,0 +1,16 @@
+import { RecentModelObject, RecentView } from "metabase-types/api";
+
+export const createMockRecentView = (
+ opts?: Partial<RecentView>,
+): RecentView => ({
+ model: "table",
+ model_object: createMockRecentModelObject(),
+ ...opts,
+});
+
+export const createMockRecentModelObject = (
+ opts?: Partial<RecentModelObject>,
+): RecentModelObject => ({
+ name: "Orders",
+ ...opts,
+});
diff --git a/frontend/src/metabase-types/api/mocks/index.ts b/frontend/src/metabase-types/api/mocks/index.ts
index a7d0161c34d..59a16978f93 100644
--- a/frontend/src/metabase-types/api/mocks/index.ts
+++ b/frontend/src/metabase-types/api/mocks/index.ts
@@ -1,3 +1,4 @@
+export * from "./activity";
export * from "./automagic-dashboards";
export * from "./collection";
export * from "./dashboard";
diff --git a/frontend/src/metabase/auth/containers/AuthLayout/AuthLayout.tsx b/frontend/src/metabase/auth/containers/AuthLayout/AuthLayout.tsx
index eb4fb566e29..ba9bc79e815 100644
--- a/frontend/src/metabase/auth/containers/AuthLayout/AuthLayout.tsx
+++ b/frontend/src/metabase/auth/containers/AuthLayout/AuthLayout.tsx
@@ -1,9 +1,10 @@
import { connect } from "react-redux";
import { PLUGIN_SELECTORS } from "metabase/plugins";
import AuthLayout from "../../components/AuthLayout";
+import { State } from "metabase-types/store";
-const mapStateToProps = (state: any, props: any) => ({
- showScene: PLUGIN_SELECTORS.getShowAuthScene(state, props),
+const mapStateToProps = (state: State) => ({
+ showScene: PLUGIN_SELECTORS.getShowBrandScene(state),
});
export default connect(mapStateToProps)(AuthLayout);
diff --git a/frontend/src/metabase/components/MetabotLogo.jsx b/frontend/src/metabase/components/MetabotLogo.jsx
deleted file mode 100644
index d8079b2006d..00000000000
--- a/frontend/src/metabase/components/MetabotLogo.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import React, { forwardRef } from "react";
-
-const MetabotLogo = forwardRef(function MetabotLogo(props, ref) {
- return (
- <img ref={ref} className="brand-hue" src="app/assets/img/metabot.svg" />
- );
-});
-
-export default MetabotLogo;
diff --git a/frontend/src/metabase/components/MetabotLogo.tsx b/frontend/src/metabase/components/MetabotLogo.tsx
new file mode 100644
index 00000000000..febce2337ab
--- /dev/null
+++ b/frontend/src/metabase/components/MetabotLogo.tsx
@@ -0,0 +1,23 @@
+import React, { forwardRef, Ref } from "react";
+import cx from "classnames";
+import { t } from "ttag";
+
+export interface MetabotLogoProps {
+ className?: string;
+}
+
+const MetabotLogo = forwardRef(function MetabotLogo(
+ props: MetabotLogoProps,
+ ref: Ref<HTMLImageElement>,
+) {
+ return (
+ <img
+ className={cx("brand-hue", props.className)}
+ ref={ref}
+ alt={t`Metabot`}
+ src="app/assets/img/metabot.svg"
+ />
+ );
+});
+
+export default MetabotLogo;
diff --git a/frontend/src/metabase/entities/recents.js b/frontend/src/metabase/entities/recents.js
index e609c8f1952..6271c541931 100644
--- a/frontend/src/metabase/entities/recents.js
+++ b/frontend/src/metabase/entities/recents.js
@@ -2,21 +2,34 @@ import { createEntity } from "metabase/lib/entities";
import { entityTypeForObject } from "metabase/lib/schema";
import { RecentsSchema } from "metabase/schema";
+export const getEntity = item => {
+ const entities = require("metabase/entities");
+ return entities[entityTypeForObject(item)];
+};
+
+export const getName = item => {
+ return item.model_object.display_name || item.model_object.name;
+};
+
+export const getIcon = item => {
+ const entity = getEntity(item);
+ return entity.objectSelectors.getIcon(item.model_object);
+};
+
const Recents = createEntity({
name: "recents",
nameOne: "recent",
path: "/api/activity/recent_views",
schema: RecentsSchema,
- // delegate to the actual object's entity wrapEntity
- wrapEntity(object, dispatch = null) {
- const entities = require("metabase/entities");
- const entity = entities[entityTypeForObject(object)];
- if (entity) {
- return entity.wrapEntity(object, dispatch);
- } else {
- console.warn("Couldn't find entity for object", object);
- return object;
- }
+
+ wrapEntity(item, dispatch = null) {
+ const entity = getEntity(item);
+ return entity.wrapEntity(item, dispatch);
+ },
+
+ objectSelectors: {
+ getName,
+ getIcon,
},
});
diff --git a/frontend/src/metabase/home/homepage/actions.ts b/frontend/src/metabase/home/homepage/actions.ts
deleted file mode 100644
index 6719ad2fe3c..00000000000
--- a/frontend/src/metabase/home/homepage/actions.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { createThunkAction } from "metabase/lib/redux";
-import { updateSetting } from "metabase/admin/settings/settings";
-
-export const HIDE_DATA = "metabase/home/homepage/HIDE_DATA";
-export const hideData = createThunkAction(HIDE_DATA, function() {
- return async function(dispatch: any) {
- const setting = { key: "show-homepage-data", value: false };
- await dispatch(updateSetting(setting));
- };
-});
-
-export const HIDE_XRAYS = "metabase/home/homepage/HIDE_XRAYS";
-export const hideXrays = createThunkAction(HIDE_XRAYS, function() {
- return async function(dispatch: any) {
- const setting = { key: "show-homepage-xrays", value: false };
- await dispatch(updateSetting(setting));
- };
-});
-
-export const HIDE_PIN_MESSAGE = "metabase/home/homepage/HIDE_PIN_MESSAGE";
-export const hidePinMessage = createThunkAction(HIDE_PIN_MESSAGE, function() {
- return async function(dispatch: any) {
- const setting = { key: "show-homepage-pin-message", value: false };
- await dispatch(updateSetting(setting));
- };
-});
-
-export const HIDE_SYNCING_MODAL = "metabase/home/homepage/HIDE_SYNCING_MODAL";
-export const hideSyncingModal = createThunkAction(
- HIDE_SYNCING_MODAL,
- function() {
- return async function(dispatch: any) {
- const setting = { key: "show-database-syncing-modal", value: false };
- await dispatch(updateSetting(setting));
- };
- },
-);
diff --git a/frontend/src/metabase/home/homepage/analytics.ts b/frontend/src/metabase/home/homepage/analytics.ts
deleted file mode 100644
index 2b89db6c212..00000000000
--- a/frontend/src/metabase/home/homepage/analytics.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { trackStructEvent } from "metabase/lib/analytics";
-import { Database, Dashboard } from "metabase-types/api";
-
-export const trackCollectionClick = () => {
- trackStructEvent("Homepage", "Browse Items Clicked");
-};
-
-export const trackDatabaseClick = (database: Database) => {
- trackStructEvent(
- "Homepage",
- "Browse DB Clicked",
- `DB Type ${database.engine}`,
- );
-};
-
-export const trackDashboardClick = (dashboard: Dashboard) => {
- trackStructEvent(
- "Homepage",
- "Pinned Item Click",
- `Pin Type ${dashboard.model}`,
- );
-};
diff --git a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.styled.tsx b/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.styled.tsx
deleted file mode 100644
index d18e32ca945..00000000000
--- a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.styled.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import styled from "@emotion/styled";
-import { color } from "metabase/lib/colors";
-import Icon from "metabase/components/Icon";
-import Link from "metabase/core/components/Link";
-
-export const CollectionContent = styled.div`
- padding: 1rem;
- background-color: ${color("bg-medium")};
-`;
-
-export const EmptyStateRoot = styled.div`
- display: flex;
- flex-direction: column;
- align-items: center;
-`;
-
-export const EmptyStateImage = styled.img`
- display: block;
- opacity: 0.5;
-`;
-
-export const EmptyStateTitle = styled.div`
- color: ${color("text-medium")};
- font-weight: 700;
-`;
-
-export const CollectionLink = styled(Link)`
- display: flex;
- justify-content: center;
- align-items: center;
- color: ${color("brand")};
- padding: 1rem;
-`;
-
-export const CollectionLinkText = styled.span`
- display: block;
- font-weight: 700;
-`;
-
-export const CollectionLinkIcon = styled(Icon)`
- display: block;
- width: 0.875rem;
- height: 0.875rem;
- margin-left: 0.5rem;
-`;
diff --git a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.tsx b/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.tsx
deleted file mode 100644
index 57624a6da19..00000000000
--- a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-import React from "react";
-import { t } from "ttag";
-import CollectionList from "metabase/components/CollectionList";
-import { ROOT_COLLECTION } from "metabase/entities/collections";
-import * as Urls from "metabase/lib/urls";
-import { Collection, User } from "metabase-types/api";
-import Section, { SectionHeader, SectionTitle } from "../Section";
-import {
- CollectionContent,
- CollectionLink,
- CollectionLinkIcon,
- CollectionLinkText,
- EmptyStateImage,
- EmptyStateRoot,
- EmptyStateTitle,
-} from "./CollectionSection.styled";
-
-export interface CollectionSectionProps {
- user: User;
- collections: Collection[];
- onCollectionClick?: () => void;
-}
-
-const CollectionSection = ({
- user,
- collections,
- onCollectionClick,
-}: CollectionSectionProps): JSX.Element => {
- const showList = collections.some(c => c.id !== user.personal_collection_id);
- const collectionUrl = Urls.collection(ROOT_COLLECTION);
-
- return (
- <Section>
- <SectionHeader>
- <SectionTitle>{ROOT_COLLECTION.name}</SectionTitle>
- </SectionHeader>
- <CollectionContent>
- {showList ? (
- <CollectionList
- collections={collections}
- analyticsContext="Homepage"
- />
- ) : (
- <EmptyState user={user} />
- )}
- <CollectionLink to={collectionUrl} onClick={onCollectionClick}>
- <CollectionLinkText>{t`Browse all items`}</CollectionLinkText>
- <CollectionLinkIcon name="chevronright" />
- </CollectionLink>
- </CollectionContent>
- </Section>
- );
-};
-
-interface EmptyStateProps {
- user: User;
-}
-
-const EmptyState = ({ user }: EmptyStateProps): JSX.Element => {
- return (
- <EmptyStateRoot>
- <EmptyStateImage
- src="app/img/empty.png"
- width={124}
- height={130}
- srcSet="app/img/empty.png 1x, app/img/empty@2x.png 2x"
- />
- <EmptyStateTitle>
- {user.is_superuser
- ? t`Save dashboards, questions, and collections in "${ROOT_COLLECTION.name}"`
- : t`Access dashboards, questions, and collections in "${ROOT_COLLECTION.name}"`}
- </EmptyStateTitle>
- </EmptyStateRoot>
- );
-};
-
-export default CollectionSection;
diff --git a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.unit.spec.tsx
deleted file mode 100644
index 3904b0b4d5b..00000000000
--- a/frontend/src/metabase/home/homepage/components/CollectionSection/CollectionSection.unit.spec.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import { createMockCollection, createMockUser } from "metabase-types/api/mocks";
-import CollectionSection from "./CollectionSection";
-
-const CollectionListMock = () => <div>CollectionList</div>;
-
-jest.mock("metabase/components/CollectionList", () => CollectionListMock);
-
-describe("CollectionSection", () => {
- it("should display the list when there are non-personal collections", () => {
- const user = createMockUser({ personal_collection_id: 1 });
- const collections = [createMockCollection({ id: 2 })];
-
- render(<CollectionSection user={user} collections={collections} />);
-
- expect(screen.getByText("CollectionList")).toBeInTheDocument();
- });
-
- it("should display an empty state when there are no non-personal collections", () => {
- const user = createMockUser();
- const collections = [
- createMockCollection({ id: user.personal_collection_id }),
- ];
-
- render(<CollectionSection user={user} collections={collections} />);
-
- expect(screen.getByText(/Access dashboards/)).toBeInTheDocument();
- });
-
- it("should display a special empty state for admins", () => {
- const user = createMockUser({ is_superuser: true });
- const collections = [
- createMockCollection({ id: user.personal_collection_id }),
- ];
-
- render(<CollectionSection user={user} collections={collections} />);
-
- expect(screen.getByText(/Save dashboards/)).toBeInTheDocument();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/components/CollectionSection/index.ts b/frontend/src/metabase/home/homepage/components/CollectionSection/index.ts
deleted file mode 100644
index ef748760cf8..00000000000
--- a/frontend/src/metabase/home/homepage/components/CollectionSection/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./CollectionSection";
diff --git a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.styled.tsx b/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.styled.tsx
deleted file mode 100644
index 15b20f70ce5..00000000000
--- a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.styled.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-import styled from "@emotion/styled";
-import { color } from "metabase/lib/colors";
-import Icon from "metabase/components/Icon";
-import Link from "metabase/core/components/Link";
-import {
- breakpointMinMedium,
- breakpointMinSmall,
-} from "metabase/styled-components/theme";
-
-export const ListRoot = styled.div`
- display: grid;
- grid-template-columns: repeat(1, 1fr);
- gap: 1rem;
-
- ${breakpointMinSmall} {
- grid-template-columns: repeat(2, 1fr);
- }
-
- ${breakpointMinMedium} {
- grid-template-columns: repeat(3, 1fr);
- }
-`;
-
-export const CardTitle = styled.span`
- display: block;
- font-size: 1.17em;
- font-weight: 700;
- overflow: hidden;
-`;
-
-export const CardIcon = styled(Icon)`
- display: block;
- width: 2rem;
- height: 2rem;
- margin-bottom: 3rem;
-`;
-
-export const CardRoot = styled(Link)`
- display: block;
- padding: 1.875rem;
- border: 0.125rem solid ${color("bg-medium")};
- border-radius: 0.375rem;
- overflow: hidden;
-`;
-
-export const DatabaseCardRoot = styled(CardRoot)`
- color: ${color("text-dark")};
- background-color: ${color("bg-medium")};
-
- ${CardIcon} {
- color: ${color("database")};
- }
-
- &:hover ${CardTitle} {
- color: ${color("brand")};
- }
-`;
-
-export const ActionCardRoot = styled(CardRoot)`
- ${CardTitle} {
- color: ${color("brand")};
- }
-
- ${CardIcon} {
- color: ${color("brand-light")};
- }
-
- &:hover {
- border-color: ${color("brand-light")};
- background-color: ${color("brand-light")};
- }
-
- &:hover ${CardIcon} {
- color: ${color("brand")};
- }
-`;
-
-export const ActionLink = styled(Link)`
- display: block;
- margin-left: auto;
- color: ${color("brand")};
- font-weight: 700;
- cursor: pointer;
-`;
diff --git a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.tsx b/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.tsx
deleted file mode 100644
index 6f514389082..00000000000
--- a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-import React, { ReactNode } from "react";
-import { t } from "ttag";
-import Button from "metabase/core/components/Button";
-import Ellipsified from "metabase/components/Ellipsified";
-import ModalWithTrigger from "metabase/components/ModalWithTrigger";
-import Tooltip from "metabase/components/Tooltip";
-import * as Urls from "metabase/lib/urls";
-import { Database, User } from "metabase-types/api";
-import Section, {
- SectionCloseIcon,
- SectionHeader,
- SectionTitle,
-} from "../Section";
-import {
- ActionCardRoot,
- ActionLink,
- CardIcon,
- CardTitle,
- DatabaseCardRoot,
- ListRoot,
-} from "./DatabaseSection.styled";
-
-export interface DatabaseSectionProps {
- user: User;
- databases: Database[];
- showData?: boolean;
- onHideData?: () => void;
- onDatabaseClick?: (database: Database) => void;
-}
-
-const DatabaseSection = ({
- user,
- databases,
- showData,
- onHideData,
- onDatabaseClick,
-}: DatabaseSectionProps): JSX.Element | null => {
- const hasAddLink = user.is_superuser;
- const hasUserDatabase = databases.some(d => !d.is_sample);
-
- if (!showData || (!databases.length && !hasAddLink)) {
- return null;
- }
-
- return (
- <Section>
- <SectionHeader>
- <SectionTitle>{t`Our data`}</SectionTitle>
- {hasAddLink && (
- <HideSectionModal onSubmit={onHideData}>
- <Tooltip tooltip={t`Hide this section`}>
- <SectionCloseIcon name="close" />
- </Tooltip>
- </HideSectionModal>
- )}
- {hasAddLink && hasUserDatabase && (
- <ActionLink to={Urls.newDatabase()}>{t`Add a database`}</ActionLink>
- )}
- </SectionHeader>
- <ListRoot>
- {databases.map(database => (
- <DatabaseCardRoot
- key={database.id}
- to={Urls.browseDatabase(database)}
- onClick={() => onDatabaseClick?.(database)}
- >
- <CardIcon name="database" />
- <CardTitle>
- <Ellipsified>{database.name}</Ellipsified>
- </CardTitle>
- </DatabaseCardRoot>
- ))}
- {hasAddLink && !hasUserDatabase && (
- <ActionCardRoot to={Urls.newDatabase()}>
- <CardIcon name="database" />
- <CardTitle>{t`Add a database`}</CardTitle>
- </ActionCardRoot>
- )}
- </ListRoot>
- </Section>
- );
-};
-
-interface HideSectionModalProps {
- children?: ReactNode;
- onSubmit?: () => void;
-}
-
-const HideSectionModal = ({
- children,
- onSubmit,
-}: HideSectionModalProps): JSX.Element => {
- return (
- <ModalWithTrigger
- title={t`Remove this section?`}
- footer={<Button danger onClick={onSubmit}>{t`Remove`}</Button>}
- triggerElement={children}
- >
- <span>
- {t`"Our Data" won’t show up on the homepage for any of your users anymore, but you can always browse through your databases and tables by clicking Browse Data in the main navigation.`}
- </span>
- </ModalWithTrigger>
- );
-};
-
-export default DatabaseSection;
diff --git a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.unit.spec.tsx
deleted file mode 100644
index dce6bc0d897..00000000000
--- a/frontend/src/metabase/home/homepage/components/DatabaseSection/DatabaseSection.unit.spec.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { createMockDatabase, createMockUser } from "metabase-types/api/mocks";
-import DatabaseSection from "./DatabaseSection";
-
-describe("DatabaseSection", () => {
- it("should display databases", () => {
- const user = createMockUser();
- const databases = [createMockDatabase({ name: "Our database" })];
-
- render(<DatabaseSection user={user} databases={databases} showData />);
-
- expect(screen.getByText("Our data")).toBeInTheDocument();
- expect(screen.getByText("Our database")).toBeInTheDocument();
- expect(screen.queryByText("Add a database")).not.toBeInTheDocument();
- });
-
- it("should not be visible when hidden by the setting", () => {
- const user = createMockUser();
- const databases = [createMockDatabase({ name: "Our database" })];
-
- render(
- <DatabaseSection user={user} databases={databases} showData={false} />,
- );
-
- expect(screen.queryByText("Our data")).not.toBeInTheDocument();
- expect(screen.queryByText("Our database")).not.toBeInTheDocument();
- });
-
- it("should not be visible when hidden by the setting", () => {
- const user = createMockUser();
- const databases = [createMockDatabase({ name: "Our database" })];
-
- render(
- <DatabaseSection user={user} databases={databases} showData={false} />,
- );
-
- expect(screen.queryByText("Our data")).not.toBeInTheDocument();
- expect(screen.queryByText("Our database")).not.toBeInTheDocument();
- });
-
- it("should not be visible for regular users when there are no databases", () => {
- const user = createMockUser();
-
- render(<DatabaseSection user={user} databases={[]} showData />);
-
- expect(screen.queryByText("Our data")).not.toBeInTheDocument();
- });
-
- it("should be visible for admin users when there are no databases", () => {
- const user = createMockUser({ is_superuser: true });
-
- render(<DatabaseSection user={user} databases={[]} showData />);
-
- expect(screen.getByText("Our data")).toBeInTheDocument();
- expect(screen.getByText("Add a database")).toBeInTheDocument();
- });
-
- it("should allow admins to hide the section", () => {
- const user = createMockUser({ is_superuser: true });
- const onHideData = jest.fn();
-
- render(
- <DatabaseSection
- user={user}
- databases={[]}
- showData
- onHideData={onHideData}
- />,
- );
-
- userEvent.click(screen.getByLabelText("close icon"));
- userEvent.click(screen.getByText("Remove"));
-
- expect(onHideData).toHaveBeenCalled();
- });
-
- it("should not allow regular users to hide the section", () => {
- const user = createMockUser({ is_superuser: false });
- const onHideData = jest.fn();
-
- render(
- <DatabaseSection
- user={user}
- databases={[]}
- showData
- onHideData={onHideData}
- />,
- );
-
- expect(screen.queryByLabelText("close icon")).not.toBeInTheDocument();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/components/DatabaseSection/index.ts b/frontend/src/metabase/home/homepage/components/DatabaseSection/index.ts
deleted file mode 100644
index aa0e50e2f54..00000000000
--- a/frontend/src/metabase/home/homepage/components/DatabaseSection/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./DatabaseSection";
diff --git a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.styled.tsx b/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.styled.tsx
deleted file mode 100644
index 30110287bd2..00000000000
--- a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.styled.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import styled from "@emotion/styled";
-import Subhead from "metabase/components/type/Subhead";
-
-export const GreetingTitle = styled(Subhead)`
- margin-left: 1rem;
-`;
-
-export const GreetingContent = styled.div`
- display: flex;
- align-items: center;
-`;
diff --git a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.tsx b/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.tsx
deleted file mode 100644
index 7dce320c992..00000000000
--- a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React, { useMemo } from "react";
-import { t } from "ttag";
-import MetabotLogo from "metabase/components/MetabotLogo";
-import Tooltip from "metabase/components/Tooltip";
-import Greeting from "metabase/lib/greeting";
-import { User } from "metabase-types/api";
-import Section from "../Section";
-import { GreetingContent, GreetingTitle } from "./GreetingSection.styled";
-
-export interface GreetingSectionProps {
- user: User;
-}
-
-const GreetingSection = ({
- user: { first_name },
-}: GreetingSectionProps): JSX.Element => {
- const greeting = useMemo(() => Greeting.sayHello(first_name), [first_name]);
-
- return (
- <Section>
- <GreetingContent>
- <Tooltip
- tooltip={t`Don't tell anyone, but you're my favorite.`}
- placement="bottom"
- >
- <MetabotLogo />
- </Tooltip>
- <GreetingTitle>{greeting}</GreetingTitle>
- </GreetingContent>
- </Section>
- );
-};
-
-export default GreetingSection;
diff --git a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.unit.spec.tsx
deleted file mode 100644
index 615948c5b52..00000000000
--- a/frontend/src/metabase/home/homepage/components/GreetingSection/GreetingSection.unit.spec.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import { createMockUser } from "metabase-types/api/mocks";
-import GreetingSection from "./GreetingSection";
-
-describe("GreetingSection", () => {
- it("should display a personal greeting", () => {
- const user = createMockUser({ first_name: "John" });
-
- render(<GreetingSection user={user} />);
-
- expect(screen.getByText(/John/)).toBeInTheDocument();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/components/GreetingSection/index.ts b/frontend/src/metabase/home/homepage/components/GreetingSection/index.ts
deleted file mode 100644
index 25458dbc7cc..00000000000
--- a/frontend/src/metabase/home/homepage/components/GreetingSection/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./GreetingSection";
diff --git a/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.styled.tsx b/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.styled.tsx
new file mode 100644
index 00000000000..9fb298d78ab
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.styled.tsx
@@ -0,0 +1,15 @@
+import styled from "@emotion/styled";
+import { alpha, color } from "metabase/lib/colors";
+import Link from "metabase/core/components/Link";
+
+export const CardRoot = styled(Link)`
+ padding: 1rem;
+ border: 1px solid ${color("border")};
+ border-radius: 0.5rem;
+ background-color: ${color("white")};
+ box-shadow: 0 7px 20px ${color("shadow")};
+
+ &:hover {
+ box-shadow: 0 10px 22px ${alpha("shadow", 0.09)};
+ }
+`;
diff --git a/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.tsx b/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.tsx
new file mode 100644
index 00000000000..684655230e9
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeCard/HomeCard.tsx
@@ -0,0 +1,22 @@
+import React, { ReactNode } from "react";
+import { CardRoot } from "./HomeCard.styled";
+
+export interface HomeCardProps {
+ className?: string;
+ url?: string;
+ children?: ReactNode;
+}
+
+const HomeCard = ({
+ className,
+ url = "",
+ children,
+}: HomeCardProps): JSX.Element => {
+ return (
+ <CardRoot className={className} to={url}>
+ {children}
+ </CardRoot>
+ );
+};
+
+export default HomeCard;
diff --git a/frontend/src/metabase/home/homepage/components/HomeCard/index.ts b/frontend/src/metabase/home/homepage/components/HomeCard/index.ts
new file mode 100644
index 00000000000..1816cf5e5ca
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeCard/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeCard";
diff --git a/frontend/src/metabase/home/homepage/components/HomeContent/HomeContent.tsx b/frontend/src/metabase/home/homepage/components/HomeContent/HomeContent.tsx
new file mode 100644
index 00000000000..f295fc0467b
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeContent/HomeContent.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+import { isSyncCompleted } from "metabase/lib/syncing";
+import { Database, RecentView } from "metabase-types/api";
+import RecentSection from "../../containers/RecentSection";
+import XraySection from "../../containers/XraySection";
+
+export interface HomeContentProps {
+ databases: Database[];
+ recents: RecentView[];
+}
+
+const HomeContent = ({
+ databases,
+ recents,
+}: HomeContentProps): JSX.Element | null => {
+ if (recents.length) {
+ return <RecentSection />;
+ } else if (databases.some(isSyncCompleted)) {
+ return <XraySection />;
+ } else {
+ return null;
+ }
+};
+
+export default HomeContent;
diff --git a/frontend/src/metabase/home/homepage/components/HomeContent/index.ts b/frontend/src/metabase/home/homepage/components/HomeContent/index.ts
new file mode 100644
index 00000000000..70ba8888d70
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeContent/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeContent";
diff --git a/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.styled.tsx b/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.styled.tsx
new file mode 100644
index 00000000000..257065f86e4
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.styled.tsx
@@ -0,0 +1,24 @@
+import styled from "@emotion/styled";
+import { color } from "metabase/lib/colors";
+import MetabotLogo from "metabase/components/MetabotLogo";
+
+export const GreetingRoot = styled.div`
+ display: flex;
+ align-items: center;
+`;
+
+export const GreetingLogo = styled(MetabotLogo)`
+ height: 2rem;
+`;
+
+export interface GreetingMessageProps {
+ showLogo?: boolean;
+}
+
+export const GreetingMessage = styled.span<GreetingMessageProps>`
+ color: ${color("text-dark")};
+ font-size: ${props => (props.showLogo ? "1.125rem" : "1.25rem")};
+ font-weight: bold;
+ line-height: 1.5rem;
+ margin-left: ${props => props.showLogo && "0.5rem"};
+`;
diff --git a/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.tsx b/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.tsx
new file mode 100644
index 00000000000..67ec4350505
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeGreeting/HomeGreeting.tsx
@@ -0,0 +1,42 @@
+import React, { useMemo } from "react";
+import _ from "underscore";
+import { t } from "ttag";
+import { User } from "metabase-types/api";
+import {
+ GreetingLogo,
+ GreetingMessage,
+ GreetingRoot,
+} from "./HomeGreeting.styled";
+
+export interface HomeGreetingProps {
+ user: User;
+ showLogo?: boolean;
+}
+
+const HomeGreeting = ({
+ user: { first_name },
+ showLogo,
+}: HomeGreetingProps): JSX.Element => {
+ const message = useMemo(() => getMessage(first_name), [first_name]);
+
+ return (
+ <GreetingRoot>
+ {showLogo && <GreetingLogo />}
+ <GreetingMessage showLogo={showLogo}>{message}</GreetingMessage>
+ </GreetingRoot>
+ );
+};
+
+const getMessage = (name: string): string => {
+ const options = [
+ t`Hey there, ${name}`,
+ t`How's it going, ${name}?`,
+ t`Howdy, ${name}`,
+ t`Greetings, ${name}`,
+ t`Good to see you, ${name}`,
+ ];
+
+ return _.sample(options) ?? "";
+};
+
+export default HomeGreeting;
diff --git a/frontend/src/metabase/home/homepage/components/HomeGreeting/index.ts b/frontend/src/metabase/home/homepage/components/HomeGreeting/index.ts
new file mode 100644
index 00000000000..c439c2fb12b
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeGreeting/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeGreeting";
diff --git a/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.styled.tsx b/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.styled.tsx
new file mode 100644
index 00000000000..a9685166679
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.styled.tsx
@@ -0,0 +1,33 @@
+import styled from "@emotion/styled";
+import { css } from "@emotion/react";
+import { alpha, color } from "metabase/lib/colors";
+
+export interface LayoutProps {
+ showScene?: boolean;
+}
+
+const sceneStyles = css`
+ background-color: ${color("bg-light")};
+ background-image: url("app/img/bridge.svg");
+ background-size: max(1728px, 100%) auto;
+ background-repeat: no-repeat;
+ background-position: bottom;
+`;
+
+const gradientStyles = css`
+ background: linear-gradient(
+ to bottom,
+ ${color("white")},
+ ${alpha("brand", 0.2)}
+ );
+`;
+
+export const LayoutRoot = styled.div<LayoutProps>`
+ height: 100%;
+ padding: 4rem 7rem;
+ ${props => (props.showScene ? sceneStyles : gradientStyles)};
+`;
+
+export const LayoutBody = styled.div`
+ margin-top: 6rem;
+`;
diff --git a/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.tsx b/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.tsx
new file mode 100644
index 00000000000..60acbc514e1
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeLayout/HomeLayout.tsx
@@ -0,0 +1,19 @@
+import React, { ReactNode } from "react";
+import GreetingSection from "../../containers/HomeGreeting";
+import { LayoutBody, LayoutRoot } from "./HomeLayout.styled";
+
+export interface HomeLayoutProps {
+ showScene?: boolean;
+ children?: ReactNode;
+}
+
+const HomeLayout = ({ showScene, children }: HomeLayoutProps): JSX.Element => {
+ return (
+ <LayoutRoot showScene={showScene}>
+ <GreetingSection />
+ <LayoutBody>{children}</LayoutBody>
+ </LayoutRoot>
+ );
+};
+
+export default HomeLayout;
diff --git a/frontend/src/metabase/home/homepage/components/HomeLayout/index.ts b/frontend/src/metabase/home/homepage/components/HomeLayout/index.ts
new file mode 100644
index 00000000000..36c7acffdb6
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomeLayout/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeLayout";
diff --git a/frontend/src/metabase/home/homepage/components/HomePage/HomePage.tsx b/frontend/src/metabase/home/homepage/components/HomePage/HomePage.tsx
new file mode 100644
index 00000000000..74b115ab0aa
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomePage/HomePage.tsx
@@ -0,0 +1,24 @@
+import React, { useEffect } from "react";
+import { isSmallScreen } from "metabase/lib/dom";
+import HomeLayout from "../../containers/HomeLayout";
+import HomeContent from "../../containers/HomeContent";
+
+export interface HomePageProps {
+ onOpenNavbar: () => void;
+}
+
+const HomePage = ({ onOpenNavbar }: HomePageProps): JSX.Element => {
+ useEffect(() => {
+ if (!isSmallScreen()) {
+ onOpenNavbar();
+ }
+ }, [onOpenNavbar]);
+
+ return (
+ <HomeLayout>
+ <HomeContent />
+ </HomeLayout>
+ );
+};
+
+export default HomePage;
diff --git a/frontend/src/metabase/home/homepage/components/HomePage/index.ts b/frontend/src/metabase/home/homepage/components/HomePage/index.ts
new file mode 100644
index 00000000000..cbd47500811
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/HomePage/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomePage";
diff --git a/frontend/src/metabase/home/homepage/components/Homepage/Homepage.styled.tsx b/frontend/src/metabase/home/homepage/components/Homepage/Homepage.styled.tsx
deleted file mode 100644
index ffb78947465..00000000000
--- a/frontend/src/metabase/home/homepage/components/Homepage/Homepage.styled.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import styled from "@emotion/styled";
-import {
- breakpointMinMedium,
- breakpointMinSmall,
-} from "metabase/styled-components/theme";
-
-export const HomepageRoot = styled.div`
- padding: 0 1rem;
-
- ${breakpointMinSmall} {
- padding: 0 2rem;
- }
-
- ${breakpointMinMedium} {
- padding: 0 4rem;
- }
-`;
diff --git a/frontend/src/metabase/home/homepage/components/Homepage/Homepage.tsx b/frontend/src/metabase/home/homepage/components/Homepage/Homepage.tsx
deleted file mode 100644
index 299457cee8e..00000000000
--- a/frontend/src/metabase/home/homepage/components/Homepage/Homepage.tsx
+++ /dev/null
@@ -1,119 +0,0 @@
-import React, { Fragment } from "react";
-import { t } from "ttag";
-import LoadingAndErrorWrapper from "metabase/components/LoadingAndErrorWrapper";
-import EmptyState from "metabase/components/EmptyState";
-import { useOnMount } from "metabase/hooks/use-on-mount";
-import { isSmallScreen } from "metabase/lib/dom";
-import CollectionSection from "../CollectionSection";
-import DatabaseSection from "../DatabaseSection";
-import GreetingSection from "../GreetingSection";
-import StartSection from "../StartSection";
-import XraySection from "../XraySection";
-import SyncingSection from "../SyncingSection/SyncingSection";
-import { HomepageRoot } from "./Homepage.styled";
-import {
- Collection,
- Dashboard,
- Database,
- DatabaseCandidate,
- User,
-} from "metabase-types/api";
-
-export interface HomepageProps {
- user: User;
- databases?: Database[];
- collections?: Collection[];
- dashboards?: Dashboard[];
- databaseCandidates?: DatabaseCandidate[];
- showData?: boolean;
- showPinMessage?: boolean;
- showSyncingModal?: boolean;
- openNavbar: () => void;
- onHideData?: () => void;
- onHideXrays?: () => void;
- onHidePinMessage?: () => void;
- onHideSyncingModal?: () => void;
- onCollectionClick?: () => void;
- onDashboardClick?: (dashboard: Dashboard) => void;
- onDatabaseClick?: (database: Database) => void;
- allError?: boolean;
-}
-
-const Homepage = ({
- user,
- databases,
- collections,
- dashboards,
- databaseCandidates,
- showData,
- showPinMessage,
- showSyncingModal,
- openNavbar,
- onHideData,
- onHideXrays,
- onHidePinMessage,
- onHideSyncingModal,
- onCollectionClick,
- onDashboardClick,
- onDatabaseClick,
- allError,
-}: HomepageProps): JSX.Element => {
- useOnMount(() => {
- if (!isSmallScreen()) {
- openNavbar();
- }
- });
-
- return (
- <HomepageRoot>
- <GreetingSection user={user} />
- {databases && collections && dashboards ? (
- <Fragment>
- <StartSection
- user={user}
- databases={databases}
- dashboards={dashboards}
- showPinMessage={showPinMessage}
- onHidePinMessage={onHidePinMessage}
- onDashboardClick={onDashboardClick}
- />
- <XraySection
- user={user}
- databaseCandidates={databaseCandidates}
- onHideXrays={onHideXrays}
- />
- <CollectionSection
- user={user}
- collections={collections}
- onCollectionClick={onCollectionClick}
- />
- <DatabaseSection
- user={user}
- databases={databases}
- showData={showData}
- onHideData={onHideData}
- onDatabaseClick={onDatabaseClick}
- />
- <SyncingSection
- user={user}
- databases={databases}
- showSyncingModal={showSyncingModal}
- onHideSyncingModal={onHideSyncingModal}
- />
- </Fragment>
- ) : allError ? (
- <EmptyState
- title={t`Something's gone wrong`}
- message={t`We've run into an error. You can try refreshing the page, or just go back.`}
- illustrationElement={
- <div className="QueryError-image QueryError-image--serverError" />
- }
- />
- ) : (
- <LoadingAndErrorWrapper loading />
- )}
- </HomepageRoot>
- );
-};
-
-export default Homepage;
diff --git a/frontend/src/metabase/home/homepage/components/Homepage/index.ts b/frontend/src/metabase/home/homepage/components/Homepage/index.ts
deleted file mode 100644
index 721908cbb4d..00000000000
--- a/frontend/src/metabase/home/homepage/components/Homepage/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./Homepage";
diff --git a/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.styled.tsx b/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.styled.tsx
new file mode 100644
index 00000000000..687c324988d
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.styled.tsx
@@ -0,0 +1,39 @@
+import styled from "@emotion/styled";
+import { color } from "metabase/lib/colors";
+import HomeCard from "metabase/home/homepage/components/HomeCard";
+import Icon from "metabase/components/Icon";
+import Ellipsified from "metabase/components/Ellipsified";
+
+export const SectionTitle = styled.div`
+ display: flex;
+ align-items: center;
+ color: ${color("text-medium")};
+ font-weight: bold;
+ margin-bottom: 1.5rem;
+`;
+
+export const RecentList = styled.div`
+ display: flex;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+`;
+
+export const RecentCard = styled(HomeCard)`
+ display: flex;
+ align-items: center;
+`;
+
+export const RecentIcon = styled(Icon)`
+ display: block;
+ flex: 0 0 auto;
+ color: ${color("brand")};
+ width: 1rem;
+ height: 1rem;
+`;
+
+export const RecentTitle = styled(Ellipsified)`
+ color: ${color("text-dark")};
+ font-size: 1rem;
+ font-weight: bold;
+ margin-left: 1rem;
+`;
diff --git a/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.tsx b/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.tsx
new file mode 100644
index 00000000000..45fb0087fc7
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/RecentSection/RecentSection.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+import { t } from "ttag";
+import * as Urls from "metabase/lib/urls";
+import { getIcon, getName } from "metabase/entities/recents";
+import { RecentView } from "metabase-types/api";
+import {
+ RecentCard,
+ RecentIcon,
+ RecentList,
+ RecentTitle,
+ SectionTitle,
+} from "./RecentSection.styled";
+
+export interface RecentSectionProps {
+ recents: RecentView[];
+}
+
+const RecentSection = ({ recents }: RecentSectionProps): JSX.Element => {
+ return (
+ <div>
+ <SectionTitle>{t`Pick up where you left off`}</SectionTitle>
+ <RecentList>
+ {recents.map((item, index) => (
+ <RecentCard key={index} url={Urls.modelToUrl(item) ?? ""}>
+ <RecentIcon {...getIcon(item)} />
+ <RecentTitle>{getName(item)}</RecentTitle>
+ </RecentCard>
+ ))}
+ </RecentList>
+ </div>
+ );
+};
+
+export default RecentSection;
diff --git a/frontend/src/metabase/home/homepage/components/RecentSection/index.ts b/frontend/src/metabase/home/homepage/components/RecentSection/index.ts
new file mode 100644
index 00000000000..38345926209
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/components/RecentSection/index.ts
@@ -0,0 +1 @@
+export { default } from "./RecentSection";
diff --git a/frontend/src/metabase/home/homepage/components/Section/Section.styled.tsx b/frontend/src/metabase/home/homepage/components/Section/Section.styled.tsx
deleted file mode 100644
index b521aa5620d..00000000000
--- a/frontend/src/metabase/home/homepage/components/Section/Section.styled.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import styled from "@emotion/styled";
-import Icon from "metabase/components/Icon";
-import { color } from "metabase/lib/colors";
-
-export const SectionHeader = styled.div`
- display: flex;
- margin-bottom: 1rem;
-`;
-
-export const SectionTitle = styled.div`
- color: ${color("text-medium")};
- font-size: 0.83em;
- font-weight: 900;
- line-height: 1rem;
- text-transform: uppercase;
- letter-spacing: 0.06em;
-`;
-
-export const SectionCloseIcon = styled(Icon)`
- display: block;
- color: ${color("text-medium")};
- cursor: pointer;
-
- &:hover {
- color: ${color("brand")};
- }
-`;
-
-export const Section = styled.div`
- margin: 2.5rem 0;
-
- ${SectionCloseIcon} {
- visibility: collapse;
- }
-
- &:hover ${SectionCloseIcon} {
- visibility: visible;
- }
-`;
diff --git a/frontend/src/metabase/home/homepage/components/Section/index.ts b/frontend/src/metabase/home/homepage/components/Section/index.ts
deleted file mode 100644
index 2bab9c1b6d3..00000000000
--- a/frontend/src/metabase/home/homepage/components/Section/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export {
- Section as default,
- SectionHeader,
- SectionTitle,
- SectionCloseIcon,
-} from "./Section.styled";
diff --git a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.styled.tsx b/frontend/src/metabase/home/homepage/components/StartSection/StartSection.styled.tsx
deleted file mode 100644
index b405b35e71a..00000000000
--- a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.styled.tsx
+++ /dev/null
@@ -1,123 +0,0 @@
-import styled from "@emotion/styled";
-import Icon from "metabase/components/Icon";
-import Link from "metabase/core/components/Link";
-import { alpha, color } from "metabase/lib/colors";
-import {
- breakpointMinMedium,
- breakpointMinSmall,
-} from "metabase/styled-components/theme";
-
-interface ListRootProps {
- hasMargin?: boolean;
-}
-
-export const ListRoot = styled.div<ListRootProps>`
- display: grid;
- grid-template-columns: repeat(1, 1fr);
- gap: 1rem;
- margin-top: ${props => (props.hasMargin ? "2.5rem" : "")};
-
- ${breakpointMinSmall} {
- grid-template-columns: repeat(2, 1fr);
- }
-
- ${breakpointMinMedium} {
- grid-template-columns: repeat(3, 1fr);
- }
-`;
-
-export const CardRoot = styled(Link)`
- display: block;
- padding: 2rem;
- color: ${color("text-dark")};
- border: 1px solid ${color("border")};
- border-radius: 0.375rem;
- background-color: ${color("white")};
- box-shadow: 0 7px 20px ${color("shadow")};
- overflow: hidden;
-
- &:hover {
- color: ${color("brand")};
- box-shadow: 0 10px 22px ${alpha(color("shadow"), 0.09)};
- }
-`;
-
-export const CardIcon = styled(Icon)`
- display: block;
- color: ${color("brand")};
- width: 1.75rem;
- height: 1.75rem;
-`;
-
-export const CardTitle = styled.span`
- display: block;
- margin-top: 1.875rem;
- font-size: 1rem;
- font-weight: 700;
- line-height: 1.5rem;
- overflow: hidden;
-`;
-
-export const BannerIconContainer = styled.div`
- display: flex;
- flex: 0 0 auto;
- justify-content: center;
- align-items: center;
- width: 2.5rem;
- height: 2.5rem;
- border: 1px solid ${color("border")};
- border-radius: 50%;
-`;
-
-export const BannerModelIcon = styled(Icon)`
- display: block;
- color: ${color("brand")};
- width: 1rem;
- height: 1rem;
-`;
-
-export const BannerCloseIcon = styled(Icon)`
- display: block;
- color: ${color("text-medium")};
- cursor: pointer;
-
- &:hover {
- color: ${color("brand")};
- }
-`;
-
-export const BannerContent = styled.div`
- flex: 1 1 auto;
- margin: 0 1rem;
-`;
-
-export const BannerTitle = styled.div`
- color: ${color("text-dark")};
- font-weight: 700;
-`;
-
-export const BannerDescription = styled.div`
- color: ${color("text-medium")};
- margin-top: 0.5rem;
-`;
-
-export const BannerLink = styled(Link)`
- display: block;
-`;
-
-export const BannerRoot = styled.div`
- display: flex;
- align-items: center;
- padding: 1.5rem;
- border: 1px solid ${color("border")};
- border-radius: 0.375rem;
- background-color: ${color("white")};
-
- ${BannerCloseIcon} {
- visibility: collapse;
- }
-
- &:hover ${BannerCloseIcon} {
- visibility: visible;
- }
-`;
diff --git a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.tsx b/frontend/src/metabase/home/homepage/components/StartSection/StartSection.tsx
deleted file mode 100644
index d23230a8f60..00000000000
--- a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.tsx
+++ /dev/null
@@ -1,168 +0,0 @@
-import React from "react";
-import { jt, t } from "ttag";
-import Ellipsified from "metabase/components/Ellipsified";
-import ExternalLink from "metabase/core/components/ExternalLink";
-import { ROOT_COLLECTION } from "metabase/entities/collections";
-import Settings from "metabase/lib/settings";
-import * as Urls from "metabase/lib/urls";
-import { Dashboard, Database, User } from "metabase-types/api";
-import Section, { SectionHeader, SectionTitle } from "../Section";
-import {
- BannerCloseIcon,
- BannerContent,
- BannerDescription,
- BannerIconContainer,
- BannerLink,
- BannerModelIcon,
- BannerRoot,
- BannerTitle,
- CardIcon,
- CardRoot,
- CardTitle,
- ListRoot,
-} from "./StartSection.styled";
-
-export interface StartSectionProps {
- user: User;
- databases: Database[];
- dashboards: Dashboard[];
- showPinMessage?: boolean;
- onHidePinMessage?: () => void;
- onDashboardClick?: (dashboard: Dashboard) => void;
-}
-
-const StartSection = ({
- user,
- databases,
- dashboards,
- showPinMessage,
- onHidePinMessage,
- onDashboardClick,
-}: StartSectionProps): JSX.Element | null => {
- const showDatabaseBanner =
- user.is_superuser && !databases.some(d => !d.is_sample);
- const showDashboardBanner =
- !dashboards.length && showPinMessage && !showDatabaseBanner;
- const showDashboardList = dashboards.length > 0;
-
- if (!showDatabaseBanner && !showDashboardBanner && !showDashboardList) {
- return null;
- }
-
- return (
- <Section>
- <SectionHeader>
- <SectionTitle>{t`Start here`}</SectionTitle>
- </SectionHeader>
- {showDatabaseBanner && <DatabaseBanner user={user} />}
- {showDashboardBanner && (
- <DashboardBanner user={user} onHidePinMessage={onHidePinMessage} />
- )}
- {showDashboardList && (
- <ListRoot hasMargin={showDatabaseBanner}>
- {dashboards.map(dashboard => (
- <DashboardCard
- key={dashboard.id}
- dashboard={dashboard}
- onDashboardClick={onDashboardClick}
- />
- ))}
- </ListRoot>
- )}
- </Section>
- );
-};
-
-interface DashboardCardProps {
- dashboard: Dashboard;
- onDashboardClick?: (dashboard: Dashboard) => void;
-}
-
-const DashboardCard = ({
- dashboard,
- onDashboardClick,
-}: DashboardCardProps): JSX.Element => {
- const dashboardUrl = Urls.dashboard(dashboard);
-
- return (
- <CardRoot to={dashboardUrl} onClick={() => onDashboardClick?.(dashboard)}>
- <CardIcon name="dashboard" />
- <CardTitle>
- <Ellipsified>{dashboard.name}</Ellipsified>
- </CardTitle>
- </CardRoot>
- );
-};
-
-export interface DatabaseBannerProps {
- user: User;
-}
-
-const DatabaseBanner = ({ user }: DatabaseBannerProps): JSX.Element => {
- const userUrl = Urls.newUser();
- const userLabel = user.has_invited_second_user
- ? t`invite another teammate`
- : t`invite a teammate`;
- const databaseUrl = Urls.newDatabase();
- const docsUrl = Settings.docsUrl(
- "administration-guide/01-managing-databases",
- );
-
- return (
- <BannerRoot>
- <BannerIconContainer>
- <BannerModelIcon name="database" />
- </BannerIconContainer>
- <BannerContent>
- <BannerTitle>{t`Connect your data to get the most out of Metabase`}</BannerTitle>
- <BannerDescription>
- {jt`If you need help, you can ${(
- <ExternalLink key="user-link" href={userUrl}>
- {userLabel}
- </ExternalLink>
- )} or ${(
- <ExternalLink key="docs-link" href={docsUrl}>
- {t`check out our setup guides`}
- </ExternalLink>
- )}.`}
- </BannerDescription>
- </BannerContent>
- <BannerLink className="Button Button--primary" to={databaseUrl}>
- {t`Add my data`}
- </BannerLink>
- </BannerRoot>
- );
-};
-
-interface DashboardBannerProps {
- user: User;
- onHidePinMessage?: () => void;
-}
-
-const DashboardBanner = ({
- user,
- onHidePinMessage,
-}: DashboardBannerProps): JSX.Element => {
- const collectionUrl = Urls.collection(ROOT_COLLECTION);
-
- return (
- <BannerRoot>
- <BannerIconContainer>
- <BannerModelIcon name="pin" />
- </BannerIconContainer>
- <BannerContent>
- <BannerTitle>{t`Your teams’ most important dashboards go here`}</BannerTitle>
- <BannerDescription>{jt`Pin dashboards in ${(
- <ExternalLink key="link" href={collectionUrl}>
- {ROOT_COLLECTION.name}
- </ExternalLink>
- )} to have them appear in this space for everyone.`}</BannerDescription>
- </BannerContent>
- {user.is_superuser && (
- <BannerCloseIcon name="close" onClick={onHidePinMessage} />
- )}
- </BannerRoot>
- );
-};
-
-export default StartSection;
diff --git a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/StartSection/StartSection.unit.spec.tsx
deleted file mode 100644
index d7ed2335499..00000000000
--- a/frontend/src/metabase/home/homepage/components/StartSection/StartSection.unit.spec.tsx
+++ /dev/null
@@ -1,172 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import {
- createMockDashboard,
- createMockDatabase,
- createMockUser,
-} from "metabase-types/api/mocks";
-import StartSection from "./StartSection";
-
-describe("StartSection", () => {
- it("should show pinned dashboards", () => {
- const user = createMockUser();
- const databases = [createMockDatabase()];
- const dashboards = [createMockDashboard({ name: "Our dashboard" })];
-
- render(
- <StartSection
- user={user}
- databases={databases}
- dashboards={dashboards}
- showPinMessage={true}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.getByText("Our dashboard")).toBeInTheDocument();
- expect(screen.queryByText(/Connect your data/)).not.toBeInTheDocument();
- expect(screen.queryByText(/Pin dashboards/)).not.toBeInTheDocument();
- });
-
- it("should show a banner for admins when there are no user databases", () => {
- const user = createMockUser({ is_superuser: true });
- const databases = [createMockDatabase({ is_sample: true })];
- const dashboards = [createMockDashboard({ name: "Our dashboard" })];
-
- render(
- <StartSection
- user={user}
- databases={databases}
- dashboards={dashboards}
- showPinMessage={true}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.getByText("Our dashboard")).toBeInTheDocument();
- expect(screen.getByText(/Connect your data/)).toBeInTheDocument();
- expect(screen.queryByText(/Pin dashboards/)).not.toBeInTheDocument();
- });
-
- it("should not show a banner for regular users when there are no user databases", () => {
- const user = createMockUser();
- const dashboards = [createMockDashboard({ name: "Our dashboard" })];
-
- render(
- <StartSection
- user={user}
- databases={[]}
- dashboards={dashboards}
- showPinMessage={true}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.getByText("Our dashboard")).toBeInTheDocument();
- expect(screen.queryByText(/Connect your data/)).not.toBeInTheDocument();
- expect(screen.queryByText(/Pin dashboards/)).not.toBeInTheDocument();
- });
-
- it("should show a banner for admins when there are no pinned dashboards", () => {
- const user = createMockUser({ is_superuser: true });
-
- render(
- <StartSection
- user={user}
- databases={[]}
- dashboards={[]}
- showPinMessage={true}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.getByText(/Connect your data/)).toBeInTheDocument();
- expect(screen.queryByText(/Pin dashboards/)).not.toBeInTheDocument();
- });
-
- it("should show a banner for regular users when there are no pinned dashboards", () => {
- const user = createMockUser();
-
- render(
- <StartSection
- user={user}
- databases={[]}
- dashboards={[]}
- showPinMessage={true}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.queryByText(/Connect your data/)).not.toBeInTheDocument();
- expect(screen.getByText(/Pin dashboards/)).toBeInTheDocument();
- });
-
- it("should not hide the section for admins when there is no content", () => {
- const user = createMockUser({ is_superuser: true });
-
- render(
- <StartSection
- user={user}
- databases={[]}
- dashboards={[]}
- showPinMessage={false}
- />,
- );
-
- expect(screen.getByText("Start here")).toBeInTheDocument();
- expect(screen.getByText(/Connect your data/)).toBeInTheDocument();
- });
-
- it("should hide the section for regular users when there is no content", () => {
- const user = createMockUser();
-
- render(
- <StartSection
- user={user}
- databases={[]}
- dashboards={[]}
- showPinMessage={false}
- />,
- );
-
- expect(screen.queryByText("Start here")).not.toBeInTheDocument();
- });
-
- it("should allow admins to hide the dashboard banner", () => {
- const user = createMockUser({ is_superuser: true });
- const databases = [createMockDatabase()];
- const onHidePinMessage = jest.fn();
-
- render(
- <StartSection
- user={user}
- databases={databases}
- dashboards={[]}
- showPinMessage={true}
- onHidePinMessage={onHidePinMessage}
- />,
- );
-
- userEvent.click(screen.getByLabelText("close icon"));
- expect(onHidePinMessage).toHaveBeenCalled();
- });
-
- it("should not allow regular users to hide the dashboard banner", () => {
- const user = createMockUser();
- const databases = [createMockDatabase()];
- const onHidePinMessage = jest.fn();
-
- render(
- <StartSection
- user={user}
- databases={databases}
- dashboards={[]}
- showPinMessage={true}
- onHidePinMessage={onHidePinMessage}
- />,
- );
-
- expect(screen.queryByLabelText("close icon")).not.toBeInTheDocument();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/components/StartSection/index.ts b/frontend/src/metabase/home/homepage/components/StartSection/index.ts
deleted file mode 100644
index 5119cd4ffbf..00000000000
--- a/frontend/src/metabase/home/homepage/components/StartSection/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./StartSection";
diff --git a/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.tsx b/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.tsx
deleted file mode 100644
index e712f9d5439..00000000000
--- a/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-import React, {
- useCallback,
- useEffect,
- useLayoutEffect,
- useState,
-} from "react";
-import moment, { Moment } from "moment-timezone";
-import { isSyncInProgress } from "metabase/lib/syncing";
-import Modal from "metabase/components/Modal";
-import SyncingModal from "metabase/containers/SyncingModal";
-import { Database, User } from "metabase-types/api";
-
-const SYNC_TIMEOUT = 30000;
-const CLOCK_TIMEOUT = 5000;
-
-export interface SyncingSectionProps {
- user: User;
- databases: Database[];
- showSyncingModal?: boolean;
- onHideSyncingModal?: () => void;
-}
-
-const SyncingSection = ({
- user,
- databases,
- showSyncingModal,
- onHideSyncingModal,
-}: SyncingSectionProps): JSX.Element => {
- const [isOpened, setIsOpened] = useState(false);
- const isOpening = useSyncingModal(databases, user, showSyncingModal);
-
- const handleClose = useCallback(() => {
- setIsOpened(false);
- }, []);
-
- useLayoutEffect(() => {
- if (isOpening) {
- setIsOpened(isOpening);
- onHideSyncingModal?.();
- }
- }, [isOpening, onHideSyncingModal]);
-
- return (
- <Modal isOpen={isOpened} small full={false} onClose={handleClose}>
- <SyncingModal onClose={handleClose} />
- </Modal>
- );
-};
-
-const useClock = (isEnabled: boolean): Moment => {
- const [now, setNow] = useState(() => moment());
-
- useEffect(() => {
- if (isEnabled) {
- const timeout = setTimeout(() => setNow(moment()), CLOCK_TIMEOUT);
- return () => clearTimeout(timeout);
- }
- }, [now, isEnabled]);
-
- return now;
-};
-
-const useSyncingModal = (
- databases: Database[],
- user: User,
- showSyncingModal = false,
-): boolean => {
- const database = getSyncingDatabase(databases, user);
- const isSyncing = database != null;
- const now = useClock(isSyncing);
- const isElapsed = database ? isSyncingForLongTime(database, now) : false;
-
- return isSyncing && isElapsed && showSyncingModal;
-};
-
-const getSyncingDatabase = (
- databases: Database[],
- user: User,
-): Database | undefined => {
- return databases.find(
- d => !d.is_sample && d.creator_id === user.id && isSyncInProgress(d),
- );
-};
-
-const isSyncingForLongTime = (database: Database, now: Moment): boolean => {
- if (isSyncInProgress(database) && database.timezone) {
- const createdAt = moment.tz(database.created_at, database.timezone);
- return now.diff(createdAt, "ms") > SYNC_TIMEOUT;
- } else {
- return false;
- }
-};
-
-export default SyncingSection;
diff --git a/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.unit.spec.tsx
deleted file mode 100644
index 78e1cae7b8d..00000000000
--- a/frontend/src/metabase/home/homepage/components/SyncingSection/SyncingSection.unit.spec.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import SyncingSection from "./SyncingSection";
-import { createMockDatabase, createMockUser } from "metabase-types/api/mocks";
-
-const SyncingModal = () => <div>Explore sample data</div>;
-jest.mock("metabase/containers/SyncingModal", () => SyncingModal);
-
-describe("SyncingSection", () => {
- beforeEach(() => {
- jest.useFakeTimers("modern");
- });
-
- afterEach(() => {
- jest.useRealTimers();
- });
-
- it("should display a modal for a syncing database after timeout", () => {
- const user = createMockUser({ id: 1 });
- const databases = [
- createMockDatabase({ is_sample: true }),
- createMockDatabase({ creator_id: 1, initial_sync_status: "incomplete" }),
- ];
- const onHideSyncingModal = jest.fn();
-
- render(
- <SyncingSection
- user={user}
- databases={databases}
- showSyncingModal={true}
- onHideSyncingModal={onHideSyncingModal}
- />,
- );
-
- expect(screen.getByText("Explore sample data")).toBeInTheDocument();
- expect(onHideSyncingModal).toHaveBeenCalled();
- });
-
- it("should not display the modal when it was already shown", () => {
- const user = createMockUser({ id: 1 });
- const databases = [
- createMockDatabase({ is_sample: true }),
- createMockDatabase({ creator_id: 1, initial_sync_status: "incomplete" }),
- ];
- const onHideSyncingModal = jest.fn();
-
- render(
- <SyncingSection
- user={user}
- databases={databases}
- showSyncingModal={false}
- onHideSyncingModal={onHideSyncingModal}
- />,
- );
-
- expect(screen.queryByText("Explore sample data")).not.toBeInTheDocument();
- expect(onHideSyncingModal).not.toHaveBeenCalled();
- });
-
- it("should not display the modal when the user is not the database creator", () => {
- const user = createMockUser({ id: 1 });
- const databases = [
- createMockDatabase({ is_sample: true }),
- createMockDatabase({ creator_id: 2, initial_sync_status: "incomplete" }),
- ];
- const onHideSyncingModal = jest.fn();
-
- render(
- <SyncingSection
- user={user}
- databases={databases}
- showSyncingModal={true}
- onHideSyncingModal={onHideSyncingModal}
- />,
- );
-
- expect(screen.queryByText("Explore sample data")).not.toBeInTheDocument();
- expect(onHideSyncingModal).not.toHaveBeenCalled();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.styled.tsx b/frontend/src/metabase/home/homepage/components/XraySection/XraySection.styled.tsx
index 784d5c884f0..b0a367cbfd3 100644
--- a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.styled.tsx
+++ b/frontend/src/metabase/home/homepage/components/XraySection/XraySection.styled.tsx
@@ -1,72 +1,75 @@
import styled from "@emotion/styled";
import { color } from "metabase/lib/colors";
-import Icon from "metabase/components/Icon";
import Link from "metabase/core/components/Link";
-import {
- breakpointMinMedium,
- breakpointMinSmall,
-} from "metabase/styled-components/theme";
+import Icon from "metabase/components/Icon";
+import Ellipsified from "metabase/components/Ellipsified";
+import HomeCard from "../HomeCard";
+
+export const SectionTitle = styled.div`
+ display: flex;
+ align-items: center;
+ color: ${color("text-dark")};
+ font-weight: bold;
+ margin-bottom: 1.5rem;
+`;
-export const ListRoot = styled.div`
- display: grid;
- grid-template-columns: repeat(1, 1fr);
- gap: 1rem;
+export const DatabaseLink = styled(Link)`
+ display: flex;
+ align-items: center;
+ margin-left: 0.5rem;
+`;
- ${breakpointMinSmall} {
- grid-template-columns: repeat(2, 1fr);
- }
+export const DatabaseIcon = styled(Icon)`
+ color: ${color("focus")};
+ width: 1rem;
+ height: 1rem;
+ margin-right: 0.25rem;
+`;
- ${breakpointMinMedium} {
- grid-template-columns: repeat(3, 1fr);
- }
+export const DatabaseTitle = styled.span`
+ color: ${color("brand")};
+ font-weight: bold;
`;
-export const CardRoot = styled(Link)`
+export const XrayList = styled.div`
display: flex;
- align-items: center;
- padding: 1.125rem 1.5rem;
- color: ${color("text-medium")};
- border: 1px solid ${color("border")};
- border-radius: 0.375rem;
- background-color: ${color("white")};
- box-shadow: 0 1px 2px ${color("shadow")};
- overflow: hidden;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+`;
- &:hover {
- color: ${color("brand")};
- }
+export const XrayCard = styled(HomeCard)`
+ display: flex;
+ align-items: center;
`;
-export const CardIcon = styled(Icon)`
+export const XrayIcon = styled(Icon)`
display: block;
+ flex: 0 0 auto;
color: ${color("white")};
- width: 1.25rem;
- height: 1.25rem;
+ width: 1rem;
+ height: 1rem;
`;
-export const CardIconContainer = styled.span`
+export const XrayIconContainer = styled.div`
display: flex;
flex: 0 0 auto;
justify-content: center;
align-items: center;
- padding: 0.625rem;
- border-radius: 0.375rem;
+ padding: 0.25rem;
+ border-radius: 0.5rem;
background-color: ${color("accent4")};
`;
-export const CardTitle = styled.span`
- display: block;
+export const XrayTitle = styled(Ellipsified)`
+ font-size: 1rem;
+ font-weight: bold;
margin-left: 1rem;
- overflow: hidden;
`;
-export const SelectRoot = styled.div`
- display: flex;
- align-items: center;
- margin-bottom: 1rem;
+export const XrayTitlePrimary = styled.span`
+ color: ${color("text-dark")};
`;
-export const SelectTitle = styled.div`
+export const XrayTitleSecondary = styled.span`
color: ${color("text-medium")};
- margin-right: 0.5rem;
`;
diff --git a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.tsx b/frontend/src/metabase/home/homepage/components/XraySection/XraySection.tsx
index 0fb5bbae701..c65972c52a1 100644
--- a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.tsx
+++ b/frontend/src/metabase/home/homepage/components/XraySection/XraySection.tsx
@@ -1,135 +1,81 @@
-import React, { ChangeEvent, ReactNode, useState } from "react";
+import React, { useMemo } from "react";
+import _ from "underscore";
import { t } from "ttag";
-import Button from "metabase/core/components/Button";
-import Ellipsified from "metabase/components/Ellipsified";
-import ModalWithTrigger from "metabase/components/ModalWithTrigger";
-import Select, { Option } from "metabase/core/components/Select";
-import Tooltip from "metabase/components/Tooltip";
-import { DatabaseCandidate, TableCandidate, User } from "metabase-types/api";
-import Section, {
- SectionCloseIcon,
- SectionHeader,
- SectionTitle,
-} from "../Section";
+import * as Urls from "metabase/lib/urls";
+import { Database, DatabaseCandidate } from "metabase-types/api";
import {
- CardIcon,
- CardIconContainer,
- CardRoot,
- CardTitle,
- ListRoot,
- SelectRoot,
- SelectTitle,
+ DatabaseIcon,
+ DatabaseLink,
+ DatabaseTitle,
+ SectionTitle,
+ XrayCard,
+ XrayIcon,
+ XrayIconContainer,
+ XrayList,
+ XrayTitle,
+ XrayTitlePrimary,
+ XrayTitleSecondary,
} from "./XraySection.styled";
export interface XraySectionProps {
- user: User;
- databaseCandidates?: DatabaseCandidate[];
- onHideXrays?: () => void;
+ database?: Database;
+ databaseCandidates: DatabaseCandidate[];
}
const XraySection = ({
- user,
- databaseCandidates = [],
- onHideXrays,
-}: XraySectionProps): JSX.Element | null => {
- if (!databaseCandidates.length) {
- return null;
- }
-
- return (
- <Section>
- <SectionHeader>
- <SectionTitle>{t`Try these x-rays based on your data`}</SectionTitle>
- {user.is_superuser && (
- <HideSectionModal onSubmit={onHideXrays}>
- <Tooltip tooltip={t`Remove these suggestions`}>
- <SectionCloseIcon name="close" />
- </Tooltip>
- </HideSectionModal>
- )}
- </SectionHeader>
- <XrayContent databases={databaseCandidates} />
- </Section>
- );
-};
-
-interface XrayContentProps {
- databases: DatabaseCandidate[];
-}
-
-const XrayContent = ({ databases }: XrayContentProps): JSX.Element => {
- const schemas = databases.map(d => d.schema);
- const [schema, setSchema] = useState(schemas[0]);
- const database = databases.find(d => d.schema === schema);
-
- const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {
- setSchema(event.target.value);
- };
+ database,
+ databaseCandidates,
+}: XraySectionProps): JSX.Element => {
+ const isSample = !database || database.is_sample;
+ const tables = databaseCandidates.flatMap(d => d.tables);
+ const tableCount = tables.length;
+ const tableMessages = useMemo(() => getMessages(tableCount), [tableCount]);
return (
<div>
- {schemas.length > 1 && (
- <SelectRoot>
- <SelectTitle>{t`Based on the schema`}</SelectTitle>
- <Select value={schema} onChange={handleChange}>
- {schemas.map(schema => (
- <Option key={schema} value={schema}>
- {schema}
- </Option>
- ))}
- </Select>
- </SelectRoot>
- )}
- {database && (
- <ListRoot>
- {database.tables.map(table => (
- <XrayCard key={table.url} table={table} />
- ))}
- </ListRoot>
+ {isSample ? (
+ <SectionTitle>
+ {t`Try out these sample x-rays to see what Metabase can do.`}
+ </SectionTitle>
+ ) : (
+ <SectionTitle>
+ {t`Here are some explorations of`}
+ <DatabaseLink to={Urls.browseDatabase(database)}>
+ <DatabaseIcon name="database" />
+ <DatabaseTitle>{database.name}</DatabaseTitle>
+ </DatabaseLink>
+ </SectionTitle>
)}
+ <XrayList>
+ {tables.map((table, index) => (
+ <XrayCard key={table.url} url={table.url}>
+ <XrayIconContainer>
+ <XrayIcon name="bolt" />
+ </XrayIconContainer>
+ <XrayTitle>
+ <XrayTitleSecondary>{tableMessages[index]}</XrayTitleSecondary>{" "}
+ <XrayTitlePrimary>{table.title}</XrayTitlePrimary>
+ </XrayTitle>
+ </XrayCard>
+ ))}
+ </XrayList>
</div>
);
};
-interface XrayCardProps {
- table: TableCandidate;
-}
-
-const XrayCard = ({ table }: XrayCardProps): JSX.Element => {
- return (
- <CardRoot to={table.url}>
- <CardIconContainer>
- <CardIcon name="bolt" />
- </CardIconContainer>
- <CardTitle>
- <Ellipsified>
- {t`A look at your`} <strong>{table.title}</strong>
- </Ellipsified>
- </CardTitle>
- </CardRoot>
- );
-};
-
-interface HideSectionModalProps {
- children?: ReactNode;
- onSubmit?: () => void;
-}
+const getMessages = (count: number) => {
+ const options = [
+ t`A look at`,
+ t`A summary of`,
+ t`A glance at`,
+ t`Some insights about`,
+ ];
-const HideSectionModal = ({
- children,
- onSubmit,
-}: HideSectionModalProps): JSX.Element => {
- return (
- <ModalWithTrigger
- title={t`Remove these suggestions?`}
- footer={<Button danger onClick={onSubmit}>{t`Remove`}</Button>}
- triggerElement={children}
- >
- <span>
- {t`These won’t show up on the homepage for any of your users anymore, but you can always get to x-rays by clicking on Browse Data in the main navigation, then clicking on the lightning bolt icon on one of your tables.`}
- </span>
- </ModalWithTrigger>
- );
+ return _.chain(count)
+ .range()
+ .map(index => options[index % options.length])
+ .sample(count)
+ .value();
};
export default XraySection;
diff --git a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.unit.spec.tsx b/frontend/src/metabase/home/homepage/components/XraySection/XraySection.unit.spec.tsx
deleted file mode 100644
index bb770946dee..00000000000
--- a/frontend/src/metabase/home/homepage/components/XraySection/XraySection.unit.spec.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-import React from "react";
-import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import {
- createMockDatabaseCandidate,
- createMockTableCandidate,
- createMockUser,
-} from "metabase-types/api/mocks";
-import XraySection from "./XraySection";
-
-describe("XraySection", () => {
- it("should display table candidates", () => {
- const user = createMockUser();
- const databaseCandidates = [
- createMockDatabaseCandidate({
- tables: [createMockTableCandidate({ title: "Orders table" })],
- }),
- ];
-
- render(<XraySection user={user} databaseCandidates={databaseCandidates} />);
-
- expect(
- screen.getByText("Try these x-rays based on your data"),
- ).toBeInTheDocument();
- expect(screen.getByText("Orders table")).toBeInTheDocument();
- });
-
- it("should allow admins to hide the section", () => {
- const user = createMockUser({ is_superuser: true });
- const databaseCandidates = [
- createMockDatabaseCandidate({
- tables: [createMockTableCandidate({ title: "Orders table" })],
- }),
- ];
- const onHideXrays = jest.fn();
-
- render(
- <XraySection
- user={user}
- databaseCandidates={databaseCandidates}
- onHideXrays={onHideXrays}
- />,
- );
-
- userEvent.click(screen.getByLabelText("close icon"));
- userEvent.click(screen.getByText("Remove"));
-
- expect(onHideXrays).toHaveBeenCalled();
- });
-
- it("should not allow non-admins to hide the section", () => {
- const user = createMockUser({ is_superuser: false });
- const databaseCandidates = [
- createMockDatabaseCandidate({
- tables: [createMockTableCandidate({ title: "Orders table" })],
- }),
- ];
-
- render(<XraySection user={user} databaseCandidates={databaseCandidates} />);
-
- expect(screen.queryByLabelText("close icon")).not.toBeInTheDocument();
- });
-
- it("should allow changing database schema for table candidates", () => {
- const user = createMockUser();
- const databaseCandidates = [
- createMockDatabaseCandidate({
- schema: "public",
- tables: [createMockTableCandidate({ title: "Public table" })],
- }),
- createMockDatabaseCandidate({
- schema: "admin",
- tables: [createMockTableCandidate({ title: "Admin table" })],
- }),
- ];
-
- render(<XraySection user={user} databaseCandidates={databaseCandidates} />);
-
- expect(screen.getByText("Public table")).toBeInTheDocument();
- expect(screen.queryByText("Admin table")).not.toBeInTheDocument();
-
- userEvent.click(screen.getByText("public"));
- userEvent.click(screen.getByText("admin"));
-
- expect(screen.queryByText("Public table")).not.toBeInTheDocument();
- expect(screen.getByText("Admin table")).toBeInTheDocument();
- });
-});
diff --git a/frontend/src/metabase/home/homepage/containers/HomeContent/HomeContent.tsx b/frontend/src/metabase/home/homepage/containers/HomeContent/HomeContent.tsx
new file mode 100644
index 00000000000..13e3eb0cdd9
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeContent/HomeContent.tsx
@@ -0,0 +1,9 @@
+import _ from "underscore";
+import Databases from "metabase/entities/databases";
+import Recents from "metabase/entities/recents";
+import HomeContent from "../../components/HomeContent";
+
+export default _.compose(
+ Databases.loadList(),
+ Recents.loadList({ reload: true }),
+)(HomeContent);
diff --git a/frontend/src/metabase/home/homepage/containers/HomeContent/index.ts b/frontend/src/metabase/home/homepage/containers/HomeContent/index.ts
new file mode 100644
index 00000000000..70ba8888d70
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeContent/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeContent";
diff --git a/frontend/src/metabase/home/homepage/containers/HomeGreeting/HomeGreeting.tsx b/frontend/src/metabase/home/homepage/containers/HomeGreeting/HomeGreeting.tsx
new file mode 100644
index 00000000000..2ab775bf9eb
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeGreeting/HomeGreeting.tsx
@@ -0,0 +1,12 @@
+import { connect } from "react-redux";
+import { getUser } from "metabase/selectors/user";
+import { PLUGIN_SELECTORS } from "metabase/plugins";
+import { State } from "metabase-types/store";
+import HomeGreeting from "../../components/HomeGreeting";
+
+const mapStateToProps = (state: State) => ({
+ user: getUser(state),
+ showLogo: PLUGIN_SELECTORS.getShowBrandLogo(state),
+});
+
+export default connect(mapStateToProps)(HomeGreeting);
diff --git a/frontend/src/metabase/home/homepage/containers/HomeGreeting/index.ts b/frontend/src/metabase/home/homepage/containers/HomeGreeting/index.ts
new file mode 100644
index 00000000000..c439c2fb12b
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeGreeting/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeGreeting";
diff --git a/frontend/src/metabase/home/homepage/containers/HomeLayout/HomeLayout.tsx b/frontend/src/metabase/home/homepage/containers/HomeLayout/HomeLayout.tsx
new file mode 100644
index 00000000000..d1c98ef94b2
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeLayout/HomeLayout.tsx
@@ -0,0 +1,10 @@
+import { connect } from "react-redux";
+import { PLUGIN_SELECTORS } from "metabase/plugins";
+import { State } from "metabase-types/store";
+import HomeLayout from "../../components/HomeLayout";
+
+const mapStateToProps = (state: State) => ({
+ showScene: PLUGIN_SELECTORS.getShowBrandScene(state),
+});
+
+export default connect(mapStateToProps)(HomeLayout);
diff --git a/frontend/src/metabase/home/homepage/containers/HomeLayout/index.ts b/frontend/src/metabase/home/homepage/containers/HomeLayout/index.ts
new file mode 100644
index 00000000000..36c7acffdb6
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomeLayout/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomeLayout";
diff --git a/frontend/src/metabase/home/homepage/containers/HomePage/HomePage.tsx b/frontend/src/metabase/home/homepage/containers/HomePage/HomePage.tsx
new file mode 100644
index 00000000000..35a607c40b7
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomePage/HomePage.tsx
@@ -0,0 +1,9 @@
+import { connect } from "react-redux";
+import { openNavbar } from "metabase/redux/app";
+import HomePage from "../../components/HomePage";
+
+const mapDispatchToProps = {
+ onOpenNavbar: openNavbar,
+};
+
+export default connect(null, mapDispatchToProps)(HomePage);
diff --git a/frontend/src/metabase/home/homepage/containers/HomePage/index.ts b/frontend/src/metabase/home/homepage/containers/HomePage/index.ts
new file mode 100644
index 00000000000..cbd47500811
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/HomePage/index.ts
@@ -0,0 +1 @@
+export { default } from "./HomePage";
diff --git a/frontend/src/metabase/home/homepage/containers/HomepageApp/HomepageApp.tsx b/frontend/src/metabase/home/homepage/containers/HomepageApp/HomepageApp.tsx
deleted file mode 100644
index 0bd5d5b4295..00000000000
--- a/frontend/src/metabase/home/homepage/containers/HomepageApp/HomepageApp.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import { connect } from "react-redux";
-import _ from "underscore";
-import Databases from "metabase/entities/databases";
-import { ROOT_COLLECTION } from "metabase/entities/collections";
-import DatabaseCandidates from "metabase/entities/database-candidates";
-import Search from "metabase/entities/search";
-import { openNavbar } from "metabase/redux/app";
-import { getUser } from "metabase/selectors/user";
-import { State } from "metabase-types/store";
-import Homepage from "../../components/Homepage";
-import {
- hideData,
- hidePinMessage,
- hideSyncingModal,
- hideXrays,
-} from "../../actions";
-import {
- getCandidatesQuery,
- getShowData,
- getShowPinMessage,
- getShowSyncingModal,
-} from "../../selectors";
-import {
- trackCollectionClick,
- trackDashboardClick,
- trackDatabaseClick,
-} from "../../analytics";
-
-const databasesProps = {
- loadingAndErrorWrapper: false,
-};
-
-const collectionsProps = {
- query: {
- collection: ROOT_COLLECTION.id,
- models: "collection",
- limit: 500,
- },
- listName: "collections",
- wrapped: true,
- loadingAndErrorWrapper: false,
-};
-
-const dashboardsProps = {
- query: {
- collection: ROOT_COLLECTION.id,
- pinned_state: "is_pinned",
- sort_column: "name",
- sort_direction: "asc",
- models: "dashboard",
- limit: 500,
- },
- listName: "dashboards",
- loadingAndErrorWrapper: false,
-};
-
-const databaseCandidatesProps = {
- query: getCandidatesQuery,
- loadingAndErrorWrapper: false,
-};
-
-const mapStateToProps = (state: State) => ({
- user: getUser(state),
- showData: getShowData(state),
- showPinMessage: getShowPinMessage(state),
- showSyncingModal: getShowSyncingModal(state),
- onCollectionClick: trackCollectionClick,
- onDashboardClick: trackDashboardClick,
- onDatabaseClick: trackDatabaseClick,
-});
-
-const mapDispatchToProps = {
- openNavbar,
- onHideData: hideData,
- onHideXrays: hideXrays,
- onHidePinMessage: hidePinMessage,
- onHideSyncingModal: hideSyncingModal,
-};
-
-export default _.compose(
- Databases.loadList(databasesProps),
- Search.loadList(collectionsProps),
- Search.loadList(dashboardsProps),
- DatabaseCandidates.loadList(databaseCandidatesProps),
- connect(mapStateToProps, mapDispatchToProps),
-)(Homepage);
diff --git a/frontend/src/metabase/home/homepage/containers/HomepageApp/index.ts b/frontend/src/metabase/home/homepage/containers/HomepageApp/index.ts
deleted file mode 100644
index 1db84496244..00000000000
--- a/frontend/src/metabase/home/homepage/containers/HomepageApp/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./HomepageApp";
diff --git a/frontend/src/metabase/home/homepage/containers/RecentSection/RecentSection.tsx b/frontend/src/metabase/home/homepage/containers/RecentSection/RecentSection.tsx
new file mode 100644
index 00000000000..60f66f3401f
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/RecentSection/RecentSection.tsx
@@ -0,0 +1,4 @@
+import Recents from "metabase/entities/recents";
+import RecentSection from "../../components/RecentSection";
+
+export default Recents.loadList()(RecentSection);
diff --git a/frontend/src/metabase/home/homepage/containers/RecentSection/index.ts b/frontend/src/metabase/home/homepage/containers/RecentSection/index.ts
new file mode 100644
index 00000000000..38345926209
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/RecentSection/index.ts
@@ -0,0 +1 @@
+export { default } from "./RecentSection";
diff --git a/frontend/src/metabase/home/homepage/containers/XraySection/XraySection.tsx b/frontend/src/metabase/home/homepage/containers/XraySection/XraySection.tsx
new file mode 100644
index 00000000000..6965a7223ca
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/XraySection/XraySection.tsx
@@ -0,0 +1,33 @@
+import { connect } from "react-redux";
+import _ from "underscore";
+import Databases from "metabase/entities/databases";
+import DatabaseCandidates from "metabase/entities/database-candidates";
+import { isSyncCompleted } from "metabase/lib/syncing";
+import { Database } from "metabase-types/api";
+import { State } from "metabase-types/store";
+import XraySection from "../../components/XraySection";
+
+interface XraySectionProps {
+ database?: Database;
+ databases: Database[];
+}
+
+const getXrayDatabase = ({ databases }: XraySectionProps) => {
+ const sampleDatabase = databases.find(d => d.is_sample && isSyncCompleted(d));
+ const userDatabase = databases.find(d => !d.is_sample && isSyncCompleted(d));
+ return userDatabase ?? sampleDatabase;
+};
+
+const getXrayQuery = (state: State, { database }: XraySectionProps) => ({
+ id: database?.id,
+});
+
+const mapStateToProps = (state: State, props: XraySectionProps) => ({
+ database: getXrayDatabase(props),
+});
+
+export default _.compose(
+ Databases.loadList(),
+ connect(mapStateToProps),
+ DatabaseCandidates.loadList({ query: getXrayQuery }),
+)(XraySection);
diff --git a/frontend/src/metabase/home/homepage/containers/XraySection/index.ts b/frontend/src/metabase/home/homepage/containers/XraySection/index.ts
new file mode 100644
index 00000000000..52cf885cb6c
--- /dev/null
+++ b/frontend/src/metabase/home/homepage/containers/XraySection/index.ts
@@ -0,0 +1 @@
+export { default } from "./XraySection";
diff --git a/frontend/src/metabase/home/homepage/selectors.ts b/frontend/src/metabase/home/homepage/selectors.ts
deleted file mode 100644
index 35b3341491d..00000000000
--- a/frontend/src/metabase/home/homepage/selectors.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import { createSelector } from "reselect";
-import { Dashboard, Database } from "metabase-types/api";
-import { State } from "metabase-types/store";
-import { createCandidatesQuery } from "./utils/database-candidates";
-
-export interface CandidatesProps {
- databases?: Database[];
- dashboards?: Dashboard[];
-}
-
-export const getCandidatesQuery = createSelector(
- (state: State, props: CandidatesProps) => props.databases,
- (state: State, props: CandidatesProps) => props.dashboards,
- (state: State) => getShowXrays(state),
- (state: State) => getEnableXrays(state),
- createCandidatesQuery,
-);
-
-export const getSettings = createSelector(
- (state: State) => state.settings,
- settings => settings.values,
-);
-
-export const getShowData = createSelector(
- [getSettings],
- settings => settings["show-homepage-data"],
-);
-
-export const getShowXrays = createSelector(
- [getSettings],
- settings => settings["show-homepage-xrays"],
-);
-
-export const getEnableXrays = createSelector(
- [getSettings],
- settings => settings["enable-xrays"],
-);
-
-export const getShowPinMessage = createSelector(
- [getSettings],
- settings => settings["show-homepage-pin-message"],
-);
-
-export const getShowSyncingModal = createSelector(
- [getSettings],
- settings => settings["show-database-syncing-modal"],
-);
diff --git a/frontend/src/metabase/home/homepage/utils/database-candidates.ts b/frontend/src/metabase/home/homepage/utils/database-candidates.ts
deleted file mode 100644
index 2187f03f6eb..00000000000
--- a/frontend/src/metabase/home/homepage/utils/database-candidates.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { isSyncCompleted } from "metabase/lib/syncing";
-import { Dashboard, Database } from "metabase-types/api";
-
-export const createCandidatesQuery = (
- databases: Database[] = [],
- dashboards?: Dashboard[],
- showXrays = false,
- enableXrays = false,
-) => {
- const sampleDatabase = databases.find(d => d.is_sample && isSyncCompleted(d));
- const userDatabase = databases.find(d => !d.is_sample && isSyncCompleted(d));
-
- if (!dashboards || dashboards.length || !showXrays || !enableXrays) {
- return;
- } else if (userDatabase) {
- return { id: userDatabase.id };
- } else if (sampleDatabase) {
- return { id: sampleDatabase.id };
- }
-};
diff --git a/frontend/src/metabase/lib/greeting.js b/frontend/src/metabase/lib/greeting.js
deleted file mode 100644
index abba71aadd2..00000000000
--- a/frontend/src/metabase/lib/greeting.js
+++ /dev/null
@@ -1,49 +0,0 @@
-import { t } from "ttag";
-
-const greetingPrefixes = [
- t`Hey there`,
- t`How's it going`,
- t`Howdy`,
- t`Greetings`,
- t`Good to see you`,
-];
-
-const subheadPrefixes = [
- t`What do you want to know?`,
- t`What's on your mind?`,
- t`What do you want to find out?`,
-];
-
-const Greeting = {
- simpleGreeting: function() {
- // TODO - this can result in an undefined thing
- const randomIndex = Math.floor(
- Math.random() * (greetingPrefixes.length - 1),
- );
- return greetingPrefixes[randomIndex];
- },
-
- sayHello: function(personalization) {
- if (personalization) {
- const g = Greeting.simpleGreeting();
- if (g === t`How's it going`) {
- return g + ", " + personalization + "?";
- } else {
- return g + ", " + personalization;
- }
- } else {
- return Greeting.simpleGreeting();
- }
- },
-
- encourageCuriosity: function() {
- // TODO - this can result in an undefined thing
- const randomIndex = Math.floor(
- Math.random() * (subheadPrefixes.length - 1),
- );
-
- return subheadPrefixes[randomIndex];
- },
-};
-
-export default Greeting;
diff --git a/frontend/src/metabase/plugins/index.ts b/frontend/src/metabase/plugins/index.ts
index 2e521d39f2b..e61421dadd8 100644
--- a/frontend/src/metabase/plugins/index.ts
+++ b/frontend/src/metabase/plugins/index.ts
@@ -10,6 +10,7 @@ import {
GroupsPermissions,
User,
} from "metabase-types/api";
+import { State } from "metabase-types/store";
// Plugin integration points. All exports must be objects or arrays so they can be mutated by plugins.
const object = () => ({});
@@ -60,8 +61,9 @@ export const PLUGIN_SHOW_CHANGE_PASSWORD_CONDITIONS = [];
// selectors that customize behavior between app versions
export const PLUGIN_SELECTORS = {
- getShowAuthScene: (state: any, props: any) => true,
- getLogoBackgroundClass: (state: any, props: any) => "bg-white",
+ getShowBrandLogo: (state: State) => true,
+ getShowBrandScene: (state: State) => true,
+ getLogoBackgroundClass: (state: State) => "bg-white",
};
export const PLUGIN_FORM_WIDGETS = {};
diff --git a/frontend/src/metabase/routes.jsx b/frontend/src/metabase/routes.jsx
index b7ad693b919..93adbb51534 100644
--- a/frontend/src/metabase/routes.jsx
+++ b/frontend/src/metabase/routes.jsx
@@ -86,8 +86,8 @@ import DashboardCopyModal from "metabase/dashboard/components/DashboardCopyModal
import DashboardDetailsModal from "metabase/dashboard/components/DashboardDetailsModal";
import { ModalRoute } from "metabase/hoc/ModalRoute";
+import HomePage from "metabase/home/homepage/containers/HomePage";
import CollectionLanding from "metabase/components/CollectionLanding/CollectionLanding";
-import HomepageApp from "metabase/home/homepage/containers/HomepageApp";
import ArchiveApp from "metabase/home/containers/ArchiveApp";
import SearchApp from "metabase/home/containers/SearchApp";
@@ -228,7 +228,7 @@ export const getRoutes = store => (
{/* The global all hands rotues, things in here are for all the folks */}
<Route
path="/"
- component={HomepageApp}
+ component={HomePage}
onEnter={(nextState, replace) => {
const page = PLUGIN_LANDING_PAGE[0] && PLUGIN_LANDING_PAGE[0]();
if (page && page !== "/") {
diff --git a/frontend/test/metabase-visual/onboarding/urls.cy.spec.js b/frontend/test/metabase-visual/onboarding/urls.cy.spec.js
index 7834a74b289..692d5aba187 100644
--- a/frontend/test/metabase-visual/onboarding/urls.cy.spec.js
+++ b/frontend/test/metabase-visual/onboarding/urls.cy.spec.js
@@ -20,9 +20,8 @@ describe("visual tests > onboarding > URLs", () => {
cy.wait("@automagic-dashboards");
- cy.findByText("Reviews table");
+ cy.findByText("Reviews");
cy.findByText("First collection");
- cy.findByText("Sample Database");
cy.percySnapshot();
});
diff --git a/frontend/test/metabase/scenarios/collections/collections.cy.spec.js b/frontend/test/metabase/scenarios/collections/collections.cy.spec.js
index 6304a5906bd..e16b48c9fc0 100644
--- a/frontend/test/metabase/scenarios/collections/collections.cy.spec.js
+++ b/frontend/test/metabase/scenarios/collections/collections.cy.spec.js
@@ -262,13 +262,10 @@ describe("scenarios > collection_defaults", () => {
it("should see a child collection in a sidebar even with revoked access to its parent (metabase#14114)", () => {
cy.visit("/");
- cy.get("main").within(() => {
- cy.findByText("Child");
- cy.findByText("Parent").should("not.exist");
+ navigationSidebar().within(() => {
+ cy.findByText("Our analytics").click();
});
- cy.findByText("Browse all items").click();
-
navigationSidebar().within(() => {
cy.findByText("Our analytics");
cy.findByText("Child");
@@ -558,7 +555,9 @@ describe("scenarios > collection_defaults", () => {
cy.visit("/");
// There is already a collection named "First collection" in the default snapshot
- cy.get("main").findByText("First collection");
+ navigationSidebar().within(() => {
+ cy.findByText("First collection");
+ });
});
});
});
diff --git a/frontend/test/metabase/scenarios/collections/permissions.cy.spec.js b/frontend/test/metabase/scenarios/collections/permissions.cy.spec.js
index b065ca1ce23..ebcfe77b1e9 100644
--- a/frontend/test/metabase/scenarios/collections/permissions.cy.spec.js
+++ b/frontend/test/metabase/scenarios/collections/permissions.cy.spec.js
@@ -91,15 +91,6 @@ describe("collection permissions", () => {
cy.findByText("Orders in a dashboard");
cy.findByText("Orders, Count");
});
- // Only pinned dashboards should show up on the home page...
- cy.visit("/");
- cy.findByText("Orders in a dashboard");
- cy.findByText("Orders, Count").should("not.exist");
- // ...but not for the user without permissions to see the root collection
- cy.signOut();
- cy.signIn("none");
- cy.visit("/");
- cy.findByText("Orders in a dashboard").should("not.exist");
});
});
diff --git a/frontend/test/metabase/scenarios/dashboard-filters/parameters.cy.spec.js b/frontend/test/metabase/scenarios/dashboard-filters/parameters.cy.spec.js
index eef40400eed..c33463d06ad 100644
--- a/frontend/test/metabase/scenarios/dashboard-filters/parameters.cy.spec.js
+++ b/frontend/test/metabase/scenarios/dashboard-filters/parameters.cy.spec.js
@@ -35,7 +35,7 @@ describe("scenarios > dashboard > parameters", () => {
cy.visit("/");
cy.wait("@collection");
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.wait("@collection");
cy.findByText("Orders in a dashboard").click();
@@ -313,7 +313,7 @@ describe("scenarios > dashboard > parameters", () => {
cy.visit("/");
cy.wait("@collection");
// find and edit the question
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.wait("@collection");
cy.findByText("DashQ").click();
cy.wait("@collection");
diff --git a/frontend/test/metabase/scenarios/dashboard/x-rays.cy.spec.js b/frontend/test/metabase/scenarios/dashboard/x-rays.cy.spec.js
index cbc04008922..7fdde07f9bc 100644
--- a/frontend/test/metabase/scenarios/dashboard/x-rays.cy.spec.js
+++ b/frontend/test/metabase/scenarios/dashboard/x-rays.cy.spec.js
@@ -24,23 +24,6 @@ describe("scenarios > x-rays", () => {
cy.signInAsAdmin();
});
- it("should exist on homepage when person first signs in", () => {
- cy.visit("/");
-
- cy.contains("A look at your Orders table");
- cy.contains("A look at your Products table");
- cy.contains("A look at your Reviews table");
-
- // Let's explore one of our tables
- cy.contains("A look at your People table").click();
-
- cy.findByText("Here's an overview of the people in your People table");
- cy.findByText("Overview");
- cy.findByText("Per state");
-
- cy.get(".Card").should("have.length", 11);
- });
-
it.skip("should work on questions with explicit joins (metabase#13112)", () => {
const PRODUCTS_ALIAS = "Products";
diff --git a/frontend/test/metabase/scenarios/onboarding/auth/forgot_password.cy.spec.js b/frontend/test/metabase/scenarios/onboarding/auth/forgot_password.cy.spec.js
index 358907fef5d..9defbfbe925 100644
--- a/frontend/test/metabase/scenarios/onboarding/auth/forgot_password.cy.spec.js
+++ b/frontend/test/metabase/scenarios/onboarding/auth/forgot_password.cy.spec.js
@@ -29,7 +29,7 @@ describe("scenarios > auth > password", () => {
cy.findByText("All done!");
cy.findByText("Sign in with your new password").click();
- cy.findByText("Start here");
+ cy.findByText(admin.first_name, { exact: false });
});
});
});
diff --git a/frontend/test/metabase/scenarios/onboarding/home/activity-page.cy.spec.js b/frontend/test/metabase/scenarios/onboarding/home/activity-page.cy.spec.js
index 36136f89493..10baa02d1f1 100644
--- a/frontend/test/metabase/scenarios/onboarding/home/activity-page.cy.spec.js
+++ b/frontend/test/metabase/scenarios/onboarding/home/activity-page.cy.spec.js
@@ -1,4 +1,3 @@
-//Replaces HomepageApp.e2e.spec.js
import {
restore,
openProductsTable,
diff --git a/frontend/test/metabase/scenarios/onboarding/home/homepage.cy.spec.js b/frontend/test/metabase/scenarios/onboarding/home/homepage.cy.spec.js
index 6cfd37a2c1e..d0ffb096a06 100644
--- a/frontend/test/metabase/scenarios/onboarding/home/homepage.cy.spec.js
+++ b/frontend/test/metabase/scenarios/onboarding/home/homepage.cy.spec.js
@@ -4,163 +4,4 @@ describe("scenarios > home > homepage", () => {
beforeEach(() => {
restore();
});
-
- describe("as admin", () => {
- beforeEach(() => {
- cy.signInAsAdmin();
- });
-
- it.skip("should handle server errors on load (metabase#20469)", () => {
- cy.intercept("GET", "/api/database", req => {
- req.reply({
- statusCode: 500,
- });
- });
-
- cy.visit("/");
- // Even if we don't receive a list of our databases, we should still be able to load all items in the root collection
- cy.findByText("Browse all items");
- });
-
- it("should allow basic navigation", () => {
- cy.visit("/");
- cy.findByText("Add my data").click();
- cy.findByText("Need help connecting?");
-
- cy.visit("/");
- cy.findByText("invite another teammate").click();
- cy.findByText("New user");
-
- cy.visit("/");
- cy.findByText("Products table").click();
- cy.findByText("Here's a quick look at your Products table");
-
- cy.visit("/");
- cy.findByText("Browse all items").click();
- cy.findByText("Your personal collection");
- cy.findByText("Other users' personal collections");
-
- cy.visit("/");
- cy.findByTextEnsureVisible("Sample Database").click();
- cy.findByText("Learn about our data");
-
- cy.visit("/");
- cy.findByText("Add a database").click();
- cy.findByText("Need help connecting?");
- });
-
- it("should show pinned dashboards", () => {
- cy.createDashboard({
- name: "Pinned dashboard",
- collection_position: 1,
- });
-
- cy.visit("/");
- cy.findByText("Pinned dashboard").click();
- cy.findByText("This dashboard is looking empty.");
- });
-
- it("should allow hiding the data section", () => {
- cy.visit("/");
-
- clickOnCloseIconInSection("Our data");
- cy.findByText("Remove").click();
- cy.findByText("Our data").should("not.exist");
- });
-
- it("should allow hiding the x-ray section", () => {
- cy.visit("/");
-
- clickOnCloseIconInSection("Try these x-rays based on your data");
- cy.findByText("Remove").click();
- cy.findByText("Try these x-rays based on your data").should("not.exist");
- });
-
- it("should show a modal when there is a newly created syncing database", () => {
- mockSyncingDatabase();
- cy.visit("/");
-
- cy.findByText("Start here");
- cy.findByText("Explore sample data").click();
- cy.findByText("Orders table over time");
-
- cy.visit("/");
- cy.findByText("Start here");
- cy.findByText("Explore sample data").should("not.exist");
- });
- });
-
- describe("as normal user", () => {
- beforeEach(() => {
- cy.signInAsNormalUser();
- });
-
- it("should allow basic navigation", () => {
- cy.visit("/");
- cy.findByRole("link", { name: "Our analytics" }).click();
- cy.findByText("Your personal collection");
-
- cy.visit("/");
- cy.findByText("Products table").click();
- cy.findByText("Here's a quick look at your Products table");
-
- cy.visit("/");
- cy.findByText("Browse all items").click();
- cy.findByText("Your personal collection");
-
- cy.visit("/");
- cy.findByTextEnsureVisible("Sample Database").click();
- cy.findByText("Learn about our data");
- });
-
- it("should hide admin controls", () => {
- cy.visit("/");
-
- cy.findByText("Start here");
- cy.findByText("Add my data").should("not.exist");
-
- cy.findByText("Our data");
- cy.findByText("Add a database").should("not.exist");
- });
-
- it("should show pinned dashboards", () => {
- cy.createDashboard({
- name: "Pinned dashboard",
- collection_position: 1,
- });
-
- cy.visit("/");
- cy.findByText("Pinned dashboard").click();
- cy.findByText("This dashboard is looking empty.");
- });
- });
});
-
-const clickOnCloseIconInSection = name => {
- cy.findByText(name)
- .parent()
- .realHover()
- .within(() => cy.findByLabelText("close icon").click());
-};
-
-const mockSyncingDatabase = () => {
- cy.request("GET", "/api/user/current").then(({ body: user }) => {
- cy.intercept("GET", /api\/database$/, req => {
- req.reply(({ body }) => {
- const [sampleDatabase] = body.data;
-
- const userDatabase = {
- ...sampleDatabase,
- id: sampleDatabase.id + 1,
- name: "H2",
- creator_id: user.id,
- created_at: "2015-01-01T20:10:30.200",
- is_sample: false,
- initial_sync_status: "incomplete",
- };
-
- body.data = [sampleDatabase, userDatabase];
- });
- });
- });
-};
diff --git a/frontend/test/metabase/scenarios/onboarding/urls.cy.spec.js b/frontend/test/metabase/scenarios/onboarding/urls.cy.spec.js
index b151dba0243..953bc89c715 100644
--- a/frontend/test/metabase/scenarios/onboarding/urls.cy.spec.js
+++ b/frontend/test/metabase/scenarios/onboarding/urls.cy.spec.js
@@ -8,13 +8,11 @@ describe("URLs", () => {
});
describe("browse databases", () => {
- ["/", "/browse"].forEach(url => {
- it(`should slugify database name when opening it from "${url}"`, () => {
- cy.visit(url);
- cy.findByTextEnsureVisible("Sample Database").click();
- cy.findByText("Sample Database");
- cy.location("pathname").should("eq", "/browse/1-sample-database");
- });
+ it(`should slugify database name when opening it from /browse"`, () => {
+ cy.visit("/browse");
+ cy.findByTextEnsureVisible("Sample Database").click();
+ cy.findByText("Sample Database");
+ cy.location("pathname").should("eq", "/browse/1-sample-database");
});
[
diff --git a/frontend/test/metabase/scenarios/smoketest/admin_setup.cy.spec.js b/frontend/test/metabase/scenarios/smoketest/admin_setup.cy.spec.js
index 39d720eccda..1e34e267788 100644
--- a/frontend/test/metabase/scenarios/smoketest/admin_setup.cy.spec.js
+++ b/frontend/test/metabase/scenarios/smoketest/admin_setup.cy.spec.js
@@ -262,11 +262,11 @@ describe("smoketest > admin_setup", () => {
cy.visit("/");
// Check names
- cy.wait(3000).contains("A look at your People table");
- cy.contains("A look at your Orders table");
- cy.contains("A look at your Test Table table").should("not.exist");
+ cy.wait(3000).contains("People");
+ cy.contains("Orders");
+ cy.contains("Test Table").should("not.exist");
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.get("h1").contains("Our analytics");
cy.findByText("A look at your").should("not.exist");
@@ -279,10 +279,9 @@ describe("smoketest > admin_setup", () => {
it("should rename a question and description as admin", () => {
cy.visit("/");
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.findByText("Other users' personal collections");
- cy.findByText("A look at your").should("not.exist");
cy.findByText("Orders, Count, Grouped by Created At (year)").click();
@@ -386,9 +385,7 @@ describe("smoketest > admin_setup", () => {
// Checking table name
- cy.contains("A look at your Test Table table");
- cy.contains("A look at your Reviews table");
- cy.contains("A look at your Orders table").should("not.exist");
+ cy.contains("Test Table");
// Navigating to Test Table table
@@ -496,12 +493,6 @@ describe("smoketest > admin_setup", () => {
cy.findByTextEnsureVisible("1 Hidden Table");
- // Check table hidden on home page
- cy.visit("/");
-
- cy.contains("A look at your People table");
- cy.contains("A look at your Reviews table").should("not.exist");
-
// Check table hidden while browsing data
cy.visit("/browse/1");
@@ -528,13 +519,13 @@ describe("smoketest > admin_setup", () => {
// Check table names and visibility
- cy.contains("A look at your People table");
- cy.contains("A look at your Test Table table");
+ cy.contains("People");
+ cy.contains("Test");
cy.findByText("Reviews").should("not.exist");
// Check question names and descriptions
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.findByTextEnsureVisible("Orders, Count");
cy.findByText("Orders, Count, Grouped by Created At (year)").should(
@@ -586,9 +577,8 @@ describe("smoketest > admin_setup", () => {
// Access to all tables as user
cy.visit("/");
- cy.contains("A look at your People table");
- cy.contains("A look at your Test Table table");
- cy.findByText("A look at your Review table").should("not.exist");
+ cy.contains("Test Table");
+ cy.findByText("Reviews").should("not.exist");
// Access to SQl queries as user
@@ -600,13 +590,15 @@ describe("smoketest > admin_setup", () => {
cy.signIn("nocollection");
cy.visit("/");
- cy.wait(2000).findByText("Try these x-rays based on your data");
- cy.contains("A look at your Test Table table");
- cy.contains("A look at your Review table").should("not.exist");
+ cy.wait(2000).findByText(
+ "Try out these sample x-rays to see what Metabase can do.",
+ );
+ cy.contains("Test Table");
+ cy.contains("Reviews").should("not.exist");
// Cannot view our analytics as no collection user
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.findByText("Orders").should("not.exist");
});
@@ -797,8 +789,7 @@ describe("smoketest > admin_setup", () => {
// Normal user can still see everything
- cy.wait(2000).contains("A look at your Test Table table");
- cy.contains("A look at your Products table");
+ cy.wait(2000).contains("Test Table");
// Normal user cannot make an SQL query
@@ -810,13 +801,13 @@ describe("smoketest > admin_setup", () => {
// No collection user sees Test Table and People table
- cy.contains("A look at your Test Table table");
- cy.contains("A look at your People table");
- cy.contains("A look at your Reviews table").should("not.exist");
+ cy.contains("Test Table");
+ cy.contains("People");
+ cy.contains("Reviews").should("not.exist");
});
it.skip("should be unable to change questions in Our analytics as no collection user", () => {
- cy.findByText("Browse all items").click();
+ cy.findByText("Our analytics").click();
cy.findByText("Everything");
cy.findByText("Orders, Count");
diff --git a/resources/frontend_client/app/img/bridge.svg b/resources/frontend_client/app/img/bridge.svg
new file mode 100644
index 00000000000..903f0560707
--- /dev/null
+++ b/resources/frontend_client/app/img/bridge.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="640" width="3333.333" xml:space="preserve"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 480h2500V0H0Z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 640)"><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-138.761a25.2 25.2 0 0 1-15.742-5.522l-14.194-11.356a25.207 25.207 0 0 0-15.742-5.522h-225.332a25.195 25.195 0 0 1-13.977-4.233L-467.8-56H0Z" transform="translate(2506 192)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-138.761a25.2 25.2 0 0 1-15.742-5.522l-14.194-11.356a25.207 25.207 0 0 0-15.742-5.522h-225.332a25.195 25.195 0 0 1-13.977-4.233L-467.8-56H0Z" transform="translate(2506 192)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a36.004 36.004 0 0 1-17.239 4.396h-136.82v-56H-5.407a36 36 0 0 0 20.645-6.508l13.56-9.492h91.143z" transform="translate(130.06 259.604)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a36.004 36.004 0 0 1-17.239 4.396h-136.82v-56H-5.407a36 36 0 0 0 20.645-6.508l13.56-9.492h91.143z" transform="translate(130.06 259.604)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-36.951a36.001 36.001 0 0 0-20.163 6.176l-52.729 35.648A36.001 36.001 0 0 1-130.006 48h-351.039c-4.58 0-9.118.874-13.371 2.575l-27.126 10.85A35.997 35.997 0 0 1-534.912 64h-71.095a36 36 0 0 0-18.522 5.13l-62.899 37.74A36 36 0 0 1-705.95 112h-440.314l24.989-17.492A35.99 35.99 0 0 1-1100.63 88h359.125a36 36 0 0 0 23.706-8.907l43.641-38.186A36 36 0 0 1-650.452 32h36.659a36.002 36.002 0 0 0 24.083-9.241l59.463-53.518A36.002 36.002 0 0 1-506.164-40h242.185v64h100.464a35.999 35.999 0 0 0 20.924-6.706l37.225-26.589A36.005 36.005 0 0 1-84.442-16h77.187A135.284 135.284 0 0 0 0 0" transform="translate(1327.978 64)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-36.951a36.001 36.001 0 0 0-20.163 6.176l-52.729 35.648A36.001 36.001 0 0 1-130.006 48h-351.039c-4.58 0-9.118.874-13.371 2.575l-27.126 10.85A35.997 35.997 0 0 1-534.912 64h-71.095a36 36 0 0 0-18.522 5.13l-62.899 37.74A36 36 0 0 1-705.95 112h-440.314l24.989-17.492A35.99 35.99 0 0 1-1100.63 88h359.125a36 36 0 0 0 23.706-8.907l43.641-38.186A36 36 0 0 1-650.452 32h36.659a36.002 36.002 0 0 0 24.083-9.241l59.463-53.518A36.002 36.002 0 0 1-506.164-40h242.185v64h100.464a35.999 35.999 0 0 0 20.924-6.706l37.225-26.589A36.005 36.005 0 0 1-84.442-16h77.187A135.284 135.284 0 0 0 0 0z" transform="translate(1327.978 64)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h7.995" transform="translate(1152.005 300)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h31.872" transform="translate(1112 300)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 25.09 6.723" transform="translate(1110.91 308.282)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 25.09-6.723" transform="translate(1110.91 291.718)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-7.995" transform="translate(984.995 300)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-31.872" transform="translate(1025 300)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-25.09 6.723" transform="translate(1026.09 308.282)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-25.09-6.723" transform="translate(1026.09 291.718)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h8v8Z" transform="translate(824 48)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a36 36 0 0 1-25.456 10.544h-93.551a36.004 36.004 0 0 0-20.925 6.706l-37.224 26.588a36.004 36.004 0 0 1-20.925 6.706h-44.463v-88h280z" transform="translate(1362.544 37.456)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a36 36 0 0 1-25.456 10.544h-93.551a36.004 36.004 0 0 0-20.925 6.706l-37.224 26.588a36.004 36.004 0 0 1-20.925 6.706h-44.463v-88h280z" transform="translate(1362.544 37.456)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0-11.046-6-20-6-20v40s6-8.954 6-20" transform="translate(1076 300)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-11.046-6-20-6-20v40s6-8.954 6-20Z" transform="translate(1076 300)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0-11.046 6-20 6-20v40S0 11.046 0 0" transform="translate(1052 300)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-11.046 6-20 6-20v40S0 11.046 0 0Z" transform="translate(1052 300)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-12.024-104h-12z" transform="translate(568.024 104)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-12.024-104h-12z" transform="translate(568.024 104)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 3.727 2.551 6.849 6 7.738A7.992 7.992 0 0 1 4 8 8 8 0 0 1 4-8c.692 0 1.36.097 2 .262C2.551-6.849 0-3.727 0 0" transform="translate(900 152)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 3.727 2.551 6.849 6 7.738A7.992 7.992 0 0 1 4 8 8 8 0 0 1 4-8c.692 0 1.36.097 2 .262C2.551-6.849 0-3.727 0 0Z" transform="translate(900 152)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 5.944 4.327 10.866 10 11.82-.652.11-1.317.18-2 .18C1.373 12-4 6.627-4 0S1.373-12 8-12c.683 0 1.348.07 2 .18C4.327-10.866 0-5.944 0 0" transform="translate(936 156)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 5.944 4.327 10.866 10 11.82-.652.11-1.317.18-2 .18C1.373 12-4 6.627-4 0S1.373-12 8-12c.683 0 1.348.07 2 .18C4.327-10.866 0-5.944 0 0Z" transform="translate(936 156)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h32l48 80Z" transform="translate(496 224)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h32l48 80Z" transform="translate(496 224)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-48-80H80Z" transform="translate(576 304)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-48-80H80Z" transform="translate(576 304)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h24l32 56Z" transform="translate(672 240)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h24l32 56Z" transform="translate(672 240)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-80-80H80Z" transform="translate(448 304)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-80-80H80Z" transform="translate(448 304)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-150.029a35.996 35.996 0 0 0-18.521 5.13l-22.9 13.74A35.996 35.996 0 0 1-209.971 24h-84.468a36.005 36.005 0 0 0-17.862 4.743l-39.398 22.514A36.005 36.005 0 0 1-369.561 56H-848" transform="translate(1008 136)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0 .359-16h-71.641c-8.837 0-16-7.163-16-16v-24h-8.359V-.253z" transform="translate(1007.641 56)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 .359-16h-71.641c-8.837 0-16-7.163-16-16v-24h-8.359V-.253z" transform="translate(1007.641 56)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0 39.997 40L80.059 0v-56H0Z" transform="translate(832 56)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 39.997 40L80.059 0v-56H0Z" transform="translate(832 56)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-135.941l48.032-47.971H48.033Z" transform="translate(1007.938 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-135.941l48.032-47.971H48.033Z" transform="translate(1007.938 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(879.938 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(887.938 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(896 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(904.062 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(912.125 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(920.187 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(928.249 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(936.311 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(944.373 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(952.436 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(960.498 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(968.56 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(976.622 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(984.684 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.063-48" transform="translate(992.746 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 48.062-48" transform="translate(1000.809 96)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 47.997 48L96.029.029" transform="translate(824 48)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-10.186a36 36 0 0 0-24.082 9.241l-59.464 53.518A36 36 0 0 1-117.814 72h-36.66a36.003 36.003 0 0 0-23.706 8.907l-43.64 38.186A36.003 36.003 0 0 1-245.526 128h-359.126a35.992 35.992 0 0 0-20.645 6.508l-61.406 42.984A35.992 35.992 0 0 1-707.348 184H-852" transform="translate(832 24)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(835 24)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(835 24)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 23.976-104h-48z" transform="translate(568.024 104)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v64" transform="translate(568)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 8 8" transform="translate(568 8)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-8 8" transform="translate(568 16)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 8 8" transform="translate(568 24)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-8 8" transform="translate(568 32)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-4 4" transform="translate(568 48)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 13.403 9.42 24.602 22 27.349A28.103 28.103 0 0 1 16 28C.536 28-12 15.464-12 0S.536-28 16-28c2.061 0 4.066.229 6 .651C9.42-24.602 0-13.403 0 0" transform="translate(664 44)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 13.403 9.42 24.602 22 27.349A28.103 28.103 0 0 1 16 28C.536 28-12 15.464-12 0S.536-28 16-28c2.061 0 4.066.229 6 .651C9.42-24.602 0-13.403 0 0Z" transform="translate(664 44)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-15.464-12.536-28-28-28S-56-15.464-56 0s12.536 28 28 28S0 15.464 0 0Z" transform="translate(708 44)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-56" transform="translate(680 56)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 16 16" transform="translate(680 32)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 13.403 9.42 24.602 22 27.349A28.103 28.103 0 0 1 16 28C.536 28-12 15.464-12 0S.536-28 16-28c2.061 0 4.066.229 6 .651C9.42-24.602 0-13.403 0 0" transform="translate(204 44)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 13.403 9.42 24.602 22 27.349A28.103 28.103 0 0 1 16 28C.536 28-12 15.464-12 0S.536-28 16-28c2.061 0 4.066.229 6 .651C9.42-24.602 0-13.403 0 0Z" transform="translate(204 44)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-15.464-12.536-28-28-28S-56-15.464-56 0s12.536 28 28 28S0 15.464 0 0Z" transform="translate(248 44)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-56" transform="translate(220 56)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 16 16" transform="translate(220 32)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-32-56-40 40-32-56H72Z" transform="translate(728 296)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-32-56-40 40-32-56H72Z" transform="translate(728 296)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h24l32 56Z" transform="translate(600 224)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h24l32 56Z" transform="translate(600 224)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h24l80 80z" transform="translate(344 224)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h24l80 80z" transform="translate(344 224)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h24l24 48Z" transform="translate(128 280)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h24l24 48Z" transform="translate(128 280)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-24-48h72Z" transform="translate(176 328)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-80-80H80Z" transform="translate(64 360)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-80-80H80Z" transform="translate(64 360)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(584 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(584 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(580 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(656 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(656 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(652 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(744 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(744 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(740 228)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-4l8 32Z" transform="translate(716 168)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-4l8 32Z" transform="translate(716 168)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-16l8 32z" transform="translate(728 168)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(720 176)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-4l8 24Z" transform="translate(508 160)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-4l8 24Z" transform="translate(508 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-16l8 24z" transform="translate(520 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(512 168)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(760 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(760 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(756 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(456 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(456 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(452 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(472 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(472 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(468 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(192 284)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(192 284)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(188 284)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(776 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(776 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(772 228)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(828 228)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(834 234)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(834 234)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(390 196)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(396 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(396 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(262 196)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(268 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(268 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(234 196)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12.002.002A6 6 0 0 0 0 0" transform="translate(240 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12.002.002A6 6 0 0 0 0 0z" transform="translate(240 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(206 196)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12.002.002A6 6 0 0 0 0 0" transform="translate(212 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12.002.002A6 6 0 0 0 0 0z" transform="translate(212 202)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(914 204)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(920 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(920 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(962 204)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(968 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(968 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(1174 204)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(1180 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(1180 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(1222 204)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(1228 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(1228 210)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(2078.497 188)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(2084.497 194)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(2084.497 194)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(2126.497 188)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0" transform="translate(2132.497 194)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a6 6 0 1 0-12 0A6 6 0 0 0 0 0z" transform="translate(2132.497 194)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-6.627-5.373-12-12-12S-24-6.627-24 0s5.373 12 12 12S0 6.627 0 0Z" transform="translate(956 156)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a8 8 0 1 0-16 0A8 8 0 0 0 0 0z" transform="translate(912 152)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(944 136)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 5.944 4.327 10.866 10 11.82-.652.11-1.317.18-2 .18C1.373 12-4 6.627-4 0S1.373-12 8-12c.683 0 1.348.07 2 .18C4.327-10.866 0-5.944 0 0" transform="translate(1148 156)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 5.944 4.327 10.866 10 11.82-.652.11-1.317.18-2 .18C1.373 12-4 6.627-4 0S1.373-12 8-12c.683 0 1.348.07 2 .18C4.327-10.866 0-5.944 0 0Z" transform="translate(1148 156)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-6.627-5.373-12-12-12S-24-6.627-24 0s5.373 12 12 12S0 6.627 0 0Z" transform="translate(1168 156)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1156 136)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(904 136)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 3.727 2.552 6.849 6 7.738A7.998 7.998 0 0 1 4 8 8 8 0 0 1 4-8c.692 0 1.359.097 2 .262C2.552-6.849 0-3.727 0 0" transform="translate(1308 104)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 3.727 2.552 6.849 6 7.738A7.998 7.998 0 0 1 4 8 8 8 0 0 1 4-8c.692 0 1.359.097 2 .262C2.552-6.849 0-3.727 0 0Z" transform="translate(1308 104)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a8 8 0 1 0-16 0A8 8 0 0 0 0 0z" transform="translate(1320 104)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1312 88)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h16l16-16H8Z" transform="translate(1016 272)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h16l16-16H8Z" transform="translate(1016 272)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 5.213-3.837 9.439-8.571 9.439a7.864 7.864 0 0 1-3.165-.672c-.989 4.01-4.309 6.964-8.264 6.964a7.88 7.88 0 0 1-3.165-.671c-.988 4.01-4.308 6.964-8.264 6.964-4.734 0-8.571-4.225-8.571-9.438 0-2.679 1.018-5.091 2.644-6.809h-.671v-7.753H-.193C-.07-1.338 0-.679 0 0" transform="translate(1168 1.976)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 5.213-3.837 9.439-8.571 9.439a7.864 7.864 0 0 1-3.165-.672c-.989 4.01-4.309 6.964-8.264 6.964a7.88 7.88 0 0 1-3.165-.671c-.988 4.01-4.308 6.964-8.264 6.964-4.734 0-8.571-4.225-8.571-9.438 0-2.679 1.018-5.091 2.644-6.809h-.671v-7.753H-.193C-.07-1.338 0-.679 0 0Z" transform="translate(1168 1.976)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-144l32 256h80z" transform="translate(1136)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-40l32 256h24Z" transform="translate(1032)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-40l32 256h24Z" transform="translate(1032)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-144l32 256h80z" transform="translate(1136)"/><path style="fill:#5ea4e3;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-10.667v10.667a5.334 5.334 0 0 0 10.667 0Z" transform="translate(1069.333)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-10.667v10.667a5.334 5.334 0 0 0 10.667 0Z" transform="translate(1069.333)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-80l-1-8H1Z" transform="translate(1104 256)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-102l-1-8H1Z" transform="translate(1115 168)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-124l-1-8H1Z" transform="translate(1126 80)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h96l-8-16H8Z" transform="translate(1016 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1112 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1064 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1048 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1080 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1032 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1016 272)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M1096 272h-64v56h64z"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M1070 280h-12v40h12z"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h104" transform="translate(1012 288)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-132a35.995 35.995 0 0 0-21.6 7.2l-12.8 9.6A35.995 35.995 0 0 1-188 24h-484l-87.593 51.096A35.996 35.996 0 0 1-777.732 80H-1040" transform="translate(1016 200)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1020 200)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1020 200)"/><path style="fill:#5ea4e3;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-10.667v10.667a5.334 5.334 0 0 0 10.667 0Z" transform="translate(877.363)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-10.667v10.667a5.334 5.334 0 0 0 10.667 0Z" transform="translate(877.363)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a23.888 23.888 0 0 1-13.338-4.047C-20.248 7.932-33.178 16-48 16S-75.752 7.932-82.662-4.047A23.888 23.888 0 0 1-96 0c-10.449 0-19.333-6.68-22.629-16H22.629C19.333-6.68 10.449 0 0 0" transform="translate(336 392)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a23.888 23.888 0 0 1-13.338-4.047C-20.248 7.932-33.178 16-48 16S-75.752 7.932-82.662-4.047A23.888 23.888 0 0 1-96 0c-10.449 0-19.333-6.68-22.629-16H22.629C19.333-6.68 10.449 0 0 0Z" transform="translate(336 392)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a23.886 23.886 0 0 1-13.338-4.047C-20.248 7.932-33.178 16-48 16S-75.752 7.932-82.662-4.047A23.888 23.888 0 0 1-96 0c-10.449 0-19.333-6.68-22.629-16H22.629C19.334-6.68 10.449 0 0 0" transform="translate(1305 408)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a23.886 23.886 0 0 1-13.338-4.047C-20.248 7.932-33.178 16-48 16S-75.752 7.932-82.662-4.047A23.888 23.888 0 0 1-96 0c-10.449 0-19.333-6.68-22.629-16H22.629C19.334-6.68 10.449 0 0 0Z" transform="translate(1305 408)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 11.046-8.954 20-20 20s-20-8.954-20-20c0-1.515.183-2.984.502-4.402A19.903 19.903 0 0 1-52 0c-11.046 0-20-8.954-20-20h52C-8.954-20 0-11.046 0 0" transform="translate(896 332)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 11.046-8.954 20-20 20s-20-8.954-20-20c0-1.515.183-2.984.502-4.402A19.903 19.903 0 0 1-52 0c-11.046 0-20-8.954-20-20h52C-8.954-20 0-11.046 0 0z" transform="translate(896 332)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 11.046-8.954 20-20 20s-20-8.954-20-20c0-1.515.183-2.984.502-4.402A19.905 19.905 0 0 1-52 0c-11.046 0-20-8.954-20-20h52C-8.954-20 0-11.046 0 0" transform="translate(1704 316)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 11.046-8.954 20-20 20s-20-8.954-20-20c0-1.515.183-2.984.502-4.402A19.905 19.905 0 0 1-52 0c-11.046 0-20-8.954-20-20h52C-8.954-20 0-11.046 0 0z" transform="translate(1704 316)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c-12.923 0-24.048-7.665-29.1-18.692C-32.762-14.594-38.072-12-44-12c-8.199 0-15.237-4.939-18.325-12h93.317C27.439-10.198 14.911 0 0 0" transform="translate(616 472)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c-12.923 0-24.048-7.665-29.1-18.692C-32.762-14.594-38.072-12-44-12c-8.199 0-15.237-4.939-18.325-12h93.317C27.439-10.198 14.911 0 0 0Z" transform="translate(616 472)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c-12.923 0-24.048-7.665-29.1-18.692C-32.763-14.594-38.072-12-44-12c-8.199 0-15.237-4.939-18.324-12h93.316C27.439-10.198 14.911 0 0 0" transform="translate(2321 384)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c-12.923 0-24.048-7.665-29.1-18.692C-32.763-14.594-38.072-12-44-12c-8.199 0-15.237-4.939-18.324-12h93.316C27.439-10.198 14.911 0 0 0Z" transform="translate(2321 384)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 6-6 8 8 8-8 6 6" transform="translate(718 278)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 6-6 8 8 8-8 6 6" transform="translate(566 286)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 6-6 8 8 8-8 6 6" transform="translate(50 345.272)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 7.453 5.103 13.697 12 15.476A15.99 15.99 0 0 1 8 16C-.836 16-8 8.837-8 0S-.836-16 8-16c1.384 0 2.719.194 4 .524C5.103-13.697 0-7.453 0 0" transform="translate(768 184)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 7.453 5.103 13.697 12 15.476A15.99 15.99 0 0 1 8 16C-.836 16-8 8.837-8 0S-.836-16 8-16c1.384 0 2.719.194 4 .524C5.103-13.697 0-7.453 0 0Z" transform="translate(768 184)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(776 176)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-8.837-7.164-16-16-16S-32-8.837-32 0s7.164 16 16 16S0 8.837 0 0Z" transform="translate(792 184)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 7.453 5.103 13.697 12 15.476A15.99 15.99 0 0 1 8 16C-.836 16-8 8.837-8 0S-.836-16 8-16c1.384 0 2.719.194 4 .524C5.103-13.697 0-7.453 0 0" transform="translate(128 24)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 7.453 5.103 13.697 12 15.476A15.99 15.99 0 0 1 8 16C-.836 16-8 8.837-8 0S-.836-16 8-16c1.384 0 2.719.194 4 .524C5.103-13.697 0-7.453 0 0Z" transform="translate(128 24)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(136 16)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-8.837-7.164-16-16-16S-32-8.837-32 0s7.164 16 16 16S0 8.837 0 0Z" transform="translate(152 24)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(347 224)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(347 224)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(699 240)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(699 240)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(683 16)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(683 16)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(163 192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(163 192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h126.875a24 24 0 0 0 15.945-6.062l58.36-51.876A24 24 0 0 1 217.125-64H344" transform="translate(1112 200)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-694.963" transform="translate(1988 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c-34.894 0-65.138 27.507-80 56-14.862-28.493-45.106-48-80-48" transform="translate(1912 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c-34.894 0-65.138 19.507-80 48-14.862-28.493-45.106-48-80-48" transform="translate(1752 168)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-80" transform="translate(1512 216)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-43.411" transform="translate(1520 203.411)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-34.277" transform="translate(1528 194.277)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-27.208" transform="translate(1536 187.208)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-21.616" transform="translate(1544 181.616)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.192" transform="translate(1552 177.192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-13.753" transform="translate(1560 173.753)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-11.179" transform="translate(1568 171.179)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-9.393" transform="translate(1576 169.393)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8.346" transform="translate(1584 168.346)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-43.411" transform="translate(1664 203.411)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-34.277" transform="translate(1656 194.277)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-27.208" transform="translate(1648 187.208)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-21.616" transform="translate(1640 181.616)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.192" transform="translate(1632 177.192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-13.753" transform="translate(1624 173.753)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-11.179" transform="translate(1616 171.179)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-9.393" transform="translate(1608 169.393)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8.346" transform="translate(1600 168.346)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-43.411" transform="translate(1824 203.411)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-34.277" transform="translate(1816 194.277)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-27.208" transform="translate(1808 187.208)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-21.616" transform="translate(1800 181.616)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.192" transform="translate(1792 177.192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-13.753" transform="translate(1784 173.753)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-11.179" transform="translate(1776 171.179)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-9.393" transform="translate(1768 169.393)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8.346" transform="translate(1760 168.346)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-42.892" transform="translate(1840 202.892)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-32" transform="translate(1848 192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-24.472" transform="translate(1856 184.472)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.687" transform="translate(1864 177.688)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-12.146" transform="translate(1872 172.147)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-7.718" transform="translate(1880 167.718)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4.324" transform="translate(1888 164.324)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-42.892" transform="translate(1504 202.892)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-32" transform="translate(1496 192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-24.472" transform="translate(1488 184.472)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.687" transform="translate(1480 177.688)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-12.146" transform="translate(1472 172.147)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-7.718" transform="translate(1464 167.718)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4.324" transform="translate(1456 164.324)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-43.411" transform="translate(1680 203.411)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-34.277" transform="translate(1688 194.277)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-27.208" transform="translate(1696 187.208)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-21.616" transform="translate(1704 181.616)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-17.192" transform="translate(1712 177.192)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-13.753" transform="translate(1720 173.753)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-11.179" transform="translate(1728 171.179)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-9.393" transform="translate(1736 169.393)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8.346" transform="translate(1744 168.346)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-80" transform="translate(1672 216)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-80" transform="translate(1832 216)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8" transform="translate(1592 168)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-8" transform="translate(1752 168)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1675 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1675 160)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1515 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1515 160)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1835 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1835 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 62.931 41.954A36.004 36.004 0 0 0 82.9 48h240.472a35.996 35.996 0 0 1 22.489 7.889l20.278 16.222A35.996 35.996 0 0 0 388.628 80H554" transform="translate(1952 136)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0 69.731 62.759A36.004 36.004 0 0 0 93.814 72H308" transform="translate(2200 184)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h98.088a36 36 0 0 0 25.456-10.544l26.912-26.912A36 36 0 0 1 175.912-48h49.219" transform="translate(1119 136)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(1512 36)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(1600 84)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(1946 84)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(2184 48)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(2432 80)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a11.953 11.953 0 0 0 7.655 2.759c5.534 0 10.193-3.746 11.58-8.841" transform="translate(1132.345 29.241)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a11.942 11.942 0 0 0 6.938 2.208c5.534 0 10.193-3.746 11.58-8.841" transform="translate(1149.062 21.792)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a11.94 11.94 0 0 0 5.72 1.448c6.627 0 12-5.373 12-12 0-1.402-.241-2.749-.683-4" transform="translate(1166.28 14.552)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(915)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(915)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(2392 260)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(2392 260)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(2388 260)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h-8l4 16z" transform="translate(2440 260)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-8l4 16z" transform="translate(2440 260)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-4" transform="translate(2436 260)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h16L8 32Z" transform="translate(2432 144)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h4l-8 32Z" transform="translate(2444 144)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h4l-8 32Z" transform="translate(2444 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h16L8 32Z" transform="translate(2432 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(2440 152)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h16L8 32Z" transform="translate(2392 144)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h4l-8 32Z" transform="translate(2404 144)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h4l-8 32Z" transform="translate(2404 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h16L8 32Z" transform="translate(2392 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(2400 152)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h16L8 32Z" transform="translate(2352 144)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0h4l-8 32Z" transform="translate(2364 144)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h4l-8 32Z" transform="translate(2364 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h16L8 32Z" transform="translate(2352 144)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(2360 152)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0 24-64h-72Z" transform="translate(1752 112)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m0 0-32-64h-16Z" transform="translate(1752 112)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-32-64h-16Z" transform="translate(1752 112)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-72M0 0l24-64h-72Z" transform="translate(1752 112)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4-5.373-4-12-4-12 4-12 4" transform="translate(1824 36)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0s5.373-4 12-4 12 4 12 4 5.373-4 12-4c1.505 0 2.938.212 4.266.531L44 4h-60l7.619-7.619C-3.522-2.621 0 0 0 0" transform="translate(1728 36)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0s5.373-4 12-4 12 4 12 4 5.373-4 12-4c1.505 0 2.938.212 4.266.531L44 4h-60l7.619-7.619C-3.522-2.621 0 0 0 0Z" transform="translate(1728 36)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h-68" transform="translate(1776 40)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c34.894 0 65.138 27.507 80 56 14.862-28.493 45.106-48 80-48" transform="translate(1432 160)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1323 48)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1323 48)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1296 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1296 160)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(907 136)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(907 136)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1347.13 88)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1347.13 88)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0" transform="translate(1128 88)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a3 3 0 1 0-6 0 3 3 0 0 0 6 0z" transform="translate(1128 88)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0-8.837 7.163-16 16-16S32-8.837 32 0s-7.163 16-16 16S0 8.837 0 0" transform="translate(2240 160)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 7.453-5.103 13.697-12 15.476 1.28.33 2.616.524 4 .524C.837 16 8 8.837 8 0S.837-16-8-16c-1.384 0-2.72.194-4 .524C-5.103-13.697 0-7.453 0 0" transform="translate(2264 160)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 7.453-5.103 13.697-12 15.476 1.28.33 2.616.524 4 .524C.837 16 8 8.837 8 0S.837-16-8-16c-1.384 0-2.72.194-4 .524C-5.103-13.697 0-7.453 0 0Z" transform="translate(2264 160)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v-16" transform="translate(2256 152)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-8.837 7.163-16 16-16S32-8.837 32 0s-7.163 16-16 16S0 8.837 0 0Z" transform="translate(2240 160)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0h72" transform="translate(1028 328)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0v10h-1L-3 0l-36-24h24z" transform="translate(1063 352)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v10h-1L-3 0l-36-24h24z" transform="translate(1063 352)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0v16" transform="translate(1064 367)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m0 0-2 9.706h-4L-8 0l-36-24.294h80z" transform="translate(1068 352.294)"/><path style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0a5 5 0 1 0-10.001.001A5 5 0 0 0 0 0" transform="translate(1069 363)"/><path style="fill:#e6f5ff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M0 0c0 2.235 1.477 4.105 3.5 4.746C3.024 4.896 2.526 5 2 5A5 5 0 0 1 2-5c.526 0 1.024.104 1.5.254C1.477-4.105 0-2.235 0 0" transform="translate(1062 363)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0 2.235 1.477 4.105 3.5 4.746C3.024 4.896 2.526 5 2 5A5 5 0 0 1 2-5c.526 0 1.024.104 1.5.254C1.477-4.105 0-2.235 0 0Z" transform="translate(1062 363)"/><path style="fill:none;stroke:#5ea4e3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0a5 5 0 1 0-10.001.001A5 5 0 0 0 0 0z" transform="translate(1069 363)"/><path style="fill:none;stroke:#e6f5ff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="M0 0c0-22.091-17.908-40-40-40S-80-22.091-80 0s17.908 40 40 40S0 22.091 0 0Z" transform="translate(2000 360)"/></g></svg>
diff --git a/src/metabase/automagic_dashboards/core.clj b/src/metabase/automagic_dashboards/core.clj
index 677e3dd968a..93b59f5cfa0 100644
--- a/src/metabase/automagic_dashboards/core.clj
+++ b/src/metabase/automagic_dashboards/core.clj
@@ -1316,7 +1316,7 @@
first)
dashboard (make-dashboard root rule)]
{:url (format "%stable/%s" public-endpoint (u/the-id table))
- :title (:full-name root)
+ :title (:short-name root)
:score (+ (math/sq (:specificity rule))
(math/log (-> table :stats :num-fields))
(if (-> table :stats :list-like?)
--
GitLab