Update zero state

questdb · Sep 15, 2023 · 9a1d78c · 9a1d78c
1 parent 1c673c2
commit 9a1d78c
Showing 1 changed file with 42 additions and 9 deletions.
diff --git a/packages/web-console/src/scenes/Result/zero-state.tsx b/packages/web-console/src/scenes/Result/zero-state.tsx
@@ -1,7 +1,7 @@
 import React from "react"
 import styled from "styled-components"
-import { PaneContent, PaneWrapper } from "../../components"
-import { Button } from "@questdb/react-components"
+import { PaneContent, PaneWrapper, Text } from "../../components"
+import { Heading } from "@questdb/react-components"
 import { useDispatch } from "react-redux"
 import { actions } from "../../store"
 
@@ -12,9 +12,26 @@ const StyledPaneContent = styled(PaneContent)`
 
 const Items = styled.div`
   display: grid;
-  grid-auto-flow: column;
+  grid-auto-flow: row;
   grid-auto-columns: max-content;
   gap: 2rem;
+  text-align: center;
+`
+
+const StyledHeading = styled(Heading)`
+  color: ${({ theme }) => theme.color.foreground};
+`
+
+const StyledText = styled(Text)`
+  line-height: 1.75;
+
+  a {
+    color: ${({ theme }) => theme.color.gray2};
+  }
+`
+
+const RunLink = styled(Text)`
+  cursor: pointer;
 `
 
 export const ZeroState = () => {
@@ -24,12 +41,28 @@ export const ZeroState = () => {
     <PaneWrapper>
       <StyledPaneContent>
         <Items>
-          <Button
-            skin="secondary"
-            onClick={() => dispatch(actions.console.setActivePanel("news"))}
-          >
-            Enterprise news
-          </Button>
+          <StyledHeading level={3}>
+            Enter a query and press{" "}
+            <RunLink
+              color="green"
+              onClick={() => dispatch(actions.query.toggleRunning())}
+            >
+              Run
+            </RunLink>{" "}
+            to view results.
+          </StyledHeading>
+          <StyledText color="gray2">
+            Get $200 in free credits when you sign up for{" "}
+            <a
+              href="https://questdb.io/cloud"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              QuestDB Cloud
+            </a>
+            .<br />
+            No credit card required.
+          </StyledText>
         </Items>
       </StyledPaneContent>
     </PaneWrapper>