diff --git a/frontend/README.md b/frontend/README.md
index 824d47482..993717fed 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -32,3 +32,17 @@ yarn dev
- Prod App: `https://near.org/dataplatform.near/widget/QueryApi.App`
+
+### ENV variables
+The React app does not use the replacement files. Instead, we need to provide an `.env` file to make sure we are accessing the right enviornment
+
+By default, the React app will use the `dev` enviornment vars
+```
+Prod:
+ NEXT_PUBLIC_HASURA_ENDPOINT=https://near-queryapi.api.pagoda.co
+ NEXT_PUBLIC_REGISTRY_CONTRACT_ID=queryapi.dataplatform.near
+```
+```
+Dev:
+ NEXT_PUBLIC_HASURA_ENDPOINT=https://near-queryapi.dev.api.pagoda.co
+ NEXT_PUBLIC_REGISTRY_CONTRACT_ID=dev-queryapi.dataplatform.near
diff --git a/frontend/package.json b/frontend/package.json
index 521197bf3..7ce4a1c14 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,8 +12,8 @@
"lint": "next lint"
},
"dependencies": {
- "@graphiql/plugin-code-exporter": "0.3.0",
- "@graphiql/plugin-explorer": "0.3.0",
+ "@graphiql/plugin-code-exporter": "0.3.5",
+ "@graphiql/plugin-explorer": "0.3.5",
"@monaco-editor/react": "^4.1.3",
"@near-lake/primitives": "0.1.0",
"@next/font": "13.1.6",
@@ -24,7 +24,7 @@
"buffer": "^6.0.3",
"eslint": "8.34.0",
"eslint-config-next": "13.1.6",
- "graphiql": "^2.4.1",
+ "graphiql": "3.0.6",
"graphql": "^16.6.0",
"near-api-js": "1.1.0",
"near-social-bridge": "^1.4.1",
diff --git a/frontend/widgets/src/QueryApi.Dashboard.jsx b/frontend/widgets/src/QueryApi.Dashboard.jsx
index fb9f7d765..23a937c91 100644
--- a/frontend/widgets/src/QueryApi.Dashboard.jsx
+++ b/frontend/widgets/src/QueryApi.Dashboard.jsx
@@ -60,7 +60,7 @@ const Wrapper = styled.div`
const NavBarLogo = styled.a`
padding-top: 0.3125rem;
padding-bottom: 0.3125rem;
- margin-right: 1rem;
+ margin-right: .01rem;
font-size: 1.25rem;
text-decoration: none;
white-space: nowrap;
@@ -274,6 +274,27 @@ const ButtonLink = styled.a`
}}
`;
+const SignUpLink = styled.a`
+ --blue: RGBA(13, 110, 253, 1);
+ display: ${({ hidden }) => (hidden ? "none" : "inline-block")};
+ font-size: 14px;
+ cursor: pointer;
+ color: var(--blue);
+ text-decoration: none;
+ margin-left: 0.1em;
+ padding: 0;
+ white-space: nowrap;
+
+ &:hover {
+ color: var(--blue);
+ text-decoration: none;
+ }
+
+ &:visited {
+ color: var(--blue);
+ text-decoration: none;
+ }
+`;
// TODO fix activeTab
// const previousSelectedTab = Storage.privateGet("queryapi:activeTab");
// if (previousSelectedTab && previousSelectedTab !== state.activeTab) {
@@ -398,6 +419,9 @@ return (
QueryApi
+