diff --git a/apps/trading-e2e/cypress.json b/apps/trading-e2e/cypress.json index 1cf90c454..9a4375883 100644 --- a/apps/trading-e2e/cypress.json +++ b/apps/trading-e2e/cypress.json @@ -8,5 +8,6 @@ "video": true, "videosFolder": "../../dist/cypress/apps/trading-e2e/videos", "screenshotsFolder": "../../dist/cypress/apps/trading-e2e/screenshots", - "chromeWebSecurity": false + "chromeWebSecurity": false, + "projectId": "et4snf" } diff --git a/apps/trading-e2e/src/integration/app.spec.ts b/apps/trading-e2e/src/integration/app.spec.ts index 397eb9f0d..f39e79816 100644 --- a/apps/trading-e2e/src/integration/app.spec.ts +++ b/apps/trading-e2e/src/integration/app.spec.ts @@ -8,6 +8,6 @@ describe('trading', () => { cy.login('my-email@something.com', 'myPassword'); // Function helper example, see `../support/app.po.ts` file - getGreeting().contains('Welcome trading'); + getGreeting().contains('Welcome to Vega Trading App'); }); }); diff --git a/apps/trading/components/navbar/index.tsx b/apps/trading/components/navbar/index.tsx index 953c443c0..f5899d036 100644 --- a/apps/trading/components/navbar/index.tsx +++ b/apps/trading/components/navbar/index.tsx @@ -1,48 +1 @@ -import { useRouter } from 'next/router'; -import { Vega } from '../icons/vega'; -import Link from 'next/link'; -import { AnchorButton } from '@vegaprotocol/ui-toolkit'; - -export const Navbar = () => { - return ( - - ); -}; - -interface NavLinkProps { - name: string; - path: string; - exact?: boolean; -} - -const NavLink = ({ name, path, exact }: NavLinkProps) => { - const router = useRouter(); - const isActive = - router.asPath === path || (!exact && router.asPath.startsWith(path)); - return ( - { - e.preventDefault(); - router.push(path); - }} - > - {name} - - ); -}; +export * from './navbar'; diff --git a/apps/trading/components/navbar/navbar.tsx b/apps/trading/components/navbar/navbar.tsx new file mode 100644 index 000000000..953c443c0 --- /dev/null +++ b/apps/trading/components/navbar/navbar.tsx @@ -0,0 +1,48 @@ +import { useRouter } from 'next/router'; +import { Vega } from '../icons/vega'; +import Link from 'next/link'; +import { AnchorButton } from '@vegaprotocol/ui-toolkit'; + +export const Navbar = () => { + return ( + + ); +}; + +interface NavLinkProps { + name: string; + path: string; + exact?: boolean; +} + +const NavLink = ({ name, path, exact }: NavLinkProps) => { + const router = useRouter(); + const isActive = + router.asPath === path || (!exact && router.asPath.startsWith(path)); + return ( + { + e.preventDefault(); + router.push(path); + }} + > + {name} + + ); +}; diff --git a/apps/trading/components/vega-wallet-connect-button/index.tsx b/apps/trading/components/vega-wallet-connect-button/index.tsx index bb7a23854..0aec11eae 100644 --- a/apps/trading/components/vega-wallet-connect-button/index.tsx +++ b/apps/trading/components/vega-wallet-connect-button/index.tsx @@ -1,4 +1,4 @@ -import { useVegaWallet } from '@vegaprotocol/react-helpers'; +import { useVegaWallet } from '@vegaprotocol/wallet'; interface VegaWalletButtonProps { setConnectDialog: (isOpen: boolean) => void; @@ -19,7 +19,7 @@ export const VegaWalletButton = ({ }; return ( - ); diff --git a/apps/trading/hooks/use-theme-switcher.ts b/apps/trading/hooks/use-theme-switcher.ts index 833906ff8..a5069ca33 100644 --- a/apps/trading/hooks/use-theme-switcher.ts +++ b/apps/trading/hooks/use-theme-switcher.ts @@ -1,23 +1,41 @@ -import { useEffect } from 'react'; +import { useEffect, useState } from 'react'; +import { LocalStorage } from '@vegaprotocol/react-helpers'; -export function useThemeSwitcher() { +const darkTheme = 'dark'; +const lightTheme = 'light'; +type themeVariant = typeof darkTheme | typeof lightTheme; + +const darkThemeCssClass = darkTheme; + +const getCurrentTheme = () => { + const theme = LocalStorage.getItem('theme'); + if ( + theme === darkTheme || + (!theme && + typeof window !== 'undefined' && + window.matchMedia('(prefers-color-scheme: dark)').matches) + ) { + return darkTheme; + } + return lightTheme; +}; + +const toggleTheme = () => { + const theme = document.documentElement.classList.contains(darkThemeCssClass) + ? lightTheme + : darkTheme; + LocalStorage.setItem('theme', theme); + return theme; +}; + +export function useThemeSwitcher(): [themeVariant, () => void] { + const [theme, setTheme] = useState(getCurrentTheme()); useEffect(() => { - if ( - localStorage.theme === 'dark' || - (!('theme' in localStorage) && - window.matchMedia('(prefers-color-scheme: dark)').matches) - ) { - document.documentElement.classList.add('dark'); + if (theme === darkTheme) { + document.documentElement.classList.add(darkThemeCssClass); } else { - document.documentElement.classList.remove('dark'); + document.documentElement.classList.remove(darkThemeCssClass); } - }, []); - - const setTheme = () => { - localStorage.theme = document.documentElement.classList.toggle('dark') - ? 'dark' - : undefined; - }; - - return setTheme; + }, [theme]); + return [theme, () => setTheme(toggleTheme)]; } diff --git a/apps/trading/hooks/use-vega-wallet-eager-connect.ts b/apps/trading/hooks/use-vega-wallet-eager-connect.ts index 4893ca394..c9433eaa3 100644 --- a/apps/trading/hooks/use-vega-wallet-eager-connect.ts +++ b/apps/trading/hooks/use-vega-wallet-eager-connect.ts @@ -1,6 +1,6 @@ -import { useVegaWallet, WALLET_CONFIG } from '@vegaprotocol/react-helpers'; +import { useVegaWallet, WALLET_CONFIG } from '@vegaprotocol/wallet'; import { useEffect } from 'react'; -import { LocalStorage } from '@vegaprotocol/storage'; +import { LocalStorage } from '@vegaprotocol/react-helpers'; import { Connectors } from '../lib/connectors'; export function useEagerConnect() { diff --git a/apps/trading/lib/connectors.ts b/apps/trading/lib/connectors.ts index 9df9ef51b..4b3a52863 100644 --- a/apps/trading/lib/connectors.ts +++ b/apps/trading/lib/connectors.ts @@ -1,4 +1,4 @@ -import { RestConnector } from '@vegaprotocol/react-helpers'; +import { RestConnector } from '@vegaprotocol/wallet'; export const rest = new RestConnector(); diff --git a/apps/trading/pages/_app.page.tsx b/apps/trading/pages/_app.page.tsx index 8a8dd6329..d4086e7aa 100644 --- a/apps/trading/pages/_app.page.tsx +++ b/apps/trading/pages/_app.page.tsx @@ -1,21 +1,19 @@ import { AppProps } from 'next/app'; import Head from 'next/head'; import { Navbar } from '../components/navbar'; -import { - VegaConnectDialog, - VegaWalletProvider, -} from '@vegaprotocol/react-helpers'; +import { ThemeContext } from '@vegaprotocol/react-helpers'; +import { VegaConnectDialog, VegaWalletProvider } from '@vegaprotocol/wallet'; import { Connectors } from '../lib/connectors'; import { useCallback, useMemo, useState } from 'react'; import { createClient } from '../lib/apollo-client'; import { ThemeSwitcher } from '@vegaprotocol/ui-toolkit'; -import './styles.css'; import { ApolloProvider } from '@apollo/client'; -import './styles.css'; import { AppLoader } from '../components/app-loader'; import { VegaWalletButton } from '../components/vega-wallet-connect-button'; import { useThemeSwitcher } from '../hooks/use-theme-switcher'; +import './styles.css'; + function VegaTradingApp({ Component, pageProps }: AppProps) { const client = useMemo( () => @@ -25,7 +23,7 @@ function VegaTradingApp({ Component, pageProps }: AppProps) { [] ); const [dialogOpen, setDialogOpen] = useState(false); - const setTheme = useThemeSwitcher(); + const [theme, toggleTheme] = useThemeSwitcher(); const setConnectDialog = useCallback((isOpen?: boolean) => { setDialogOpen((curr) => { @@ -35,37 +33,39 @@ function VegaTradingApp({ Component, pageProps }: AppProps) { }, []); return ( - - - - - Welcome to trading! - - -
-
- -
- - + + + + + + Welcome to trading! + + +
+
+ +
+ + +
+
+ +
+
-
- -
- -
- - - + + + + ); } diff --git a/apps/trading/pages/index.page.tsx b/apps/trading/pages/index.page.tsx index 5e737d079..6b5bd7a2b 100644 --- a/apps/trading/pages/index.page.tsx +++ b/apps/trading/pages/index.page.tsx @@ -1,21 +1,38 @@ -import { Callout, Button } from '@vegaprotocol/ui-toolkit'; +import { + AgGridDynamic as AgGrid, + Button, + Callout, +} from '@vegaprotocol/ui-toolkit'; +import { AgGridColumn } from 'ag-grid-react'; export function Index() { + const rowData = [ + { make: 'Toyota', model: 'Celica', price: 35000 }, + { make: 'Ford', model: 'Mondeo', price: 32000 }, + { make: 'Porsche', model: 'Boxter', price: 72000 }, + ]; return (
- -
-
With a longer explaination
- -
-
+
+ +
+
With a longer explaination
+ +
+
+
+ + + + +
); } diff --git a/apps/trading/pages/portfolio/index.page.tsx b/apps/trading/pages/portfolio/index.page.tsx index 0b5651b65..484564ca7 100644 --- a/apps/trading/pages/portfolio/index.page.tsx +++ b/apps/trading/pages/portfolio/index.page.tsx @@ -1,4 +1,4 @@ -import { useVegaWallet } from '@vegaprotocol/react-helpers'; +import { useVegaWallet } from '@vegaprotocol/wallet'; const Portfolio = () => { const { keypair } = useVegaWallet(); diff --git a/apps/trading/specs/index.spec.tsx b/apps/trading/specs/index.spec.tsx index 25c0471c4..65b343075 100644 --- a/apps/trading/specs/index.spec.tsx +++ b/apps/trading/specs/index.spec.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { render } from '@testing-library/react'; import Index from '../pages/index.page'; -import { VegaWalletContext } from '@vegaprotocol/react-helpers'; +import { VegaWalletContext } from '@vegaprotocol/wallet'; describe('Index', () => { it('should render successfully', () => { @@ -15,6 +15,7 @@ describe('Index', () => { disconnect: jest.fn(), selectPublicKey: jest.fn(), connector: null, + sendTx: jest.fn(), }} > diff --git a/apps/trading/tailwind.config.js b/apps/trading/tailwind.config.js index 6bb81b572..1791478d2 100644 --- a/apps/trading/tailwind.config.js +++ b/apps/trading/tailwind.config.js @@ -9,8 +9,6 @@ module.exports = { ...createGlobPatternsForDependencies(__dirname), ], darkMode: 'class', - theme: { - extend: theme, - }, + theme, plugins: [], }; diff --git a/libs/react-helpers/src/index.ts b/libs/react-helpers/src/index.ts index 8135a80d0..61504ca1d 100644 --- a/libs/react-helpers/src/index.ts +++ b/libs/react-helpers/src/index.ts @@ -1,3 +1,3 @@ -export * from './lib/react-helpers'; +export * from './lib/context'; +export * from './lib/storage'; export * from './lib/trading'; -export * from './lib/vega-wallet'; diff --git a/libs/react-helpers/src/lib/context/context.tsx b/libs/react-helpers/src/lib/context/context.tsx new file mode 100644 index 000000000..37c6afb0d --- /dev/null +++ b/libs/react-helpers/src/lib/context/context.tsx @@ -0,0 +1,3 @@ +import * as React from 'react'; + +export const ThemeContext = React.createContext<'light' | 'dark'>('dark'); diff --git a/libs/react-helpers/src/lib/context/index.tsx b/libs/react-helpers/src/lib/context/index.tsx new file mode 100644 index 000000000..c38e8e821 --- /dev/null +++ b/libs/react-helpers/src/lib/context/index.tsx @@ -0,0 +1 @@ +export * from './context'; diff --git a/libs/react-helpers/src/lib/react-helpers.spec.tsx b/libs/react-helpers/src/lib/react-helpers.spec.tsx deleted file mode 100644 index c7b6f9406..000000000 --- a/libs/react-helpers/src/lib/react-helpers.spec.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { render } from '@testing-library/react'; - -import ReactHelpers from './react-helpers'; - -describe('ReactHelpers', () => { - it('should render successfully', () => { - const { baseElement } = render(); - expect(baseElement).toBeTruthy(); - }); -}); diff --git a/libs/react-helpers/src/lib/react-helpers.tsx b/libs/react-helpers/src/lib/react-helpers.tsx deleted file mode 100644 index 5d769a104..000000000 --- a/libs/react-helpers/src/lib/react-helpers.tsx +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-disable-next-line */ -export interface ReactHelpersProps {} - -export function ReactHelpers(props: ReactHelpersProps) { - return ( -
-

Welcome to ReactHelpers!

-
- ); -} - -export default ReactHelpers; diff --git a/libs/storage/src/index.js b/libs/react-helpers/src/lib/storage/index.ts similarity index 86% rename from libs/storage/src/index.js rename to libs/react-helpers/src/lib/storage/index.ts index 04695f858..b2595514f 100644 --- a/libs/storage/src/index.js +++ b/libs/react-helpers/src/lib/storage/index.ts @@ -1,6 +1,6 @@ // TODO: fine for now however will leak state between tests (we don't really have) in future. Ideally should use a provider export const LocalStorage = { - getItem: (key) => { + getItem: (key: string) => { if (typeof window === 'undefined') return; try { const item = window.localStorage.getItem(key); @@ -10,7 +10,7 @@ export const LocalStorage = { return null; } }, - setItem: (key, value) => { + setItem: (key: string, value: string) => { if (typeof window === 'undefined') return; try { window.localStorage.setItem(key, value); @@ -18,7 +18,7 @@ export const LocalStorage = { console.error(error); } }, - removeItem: (key) => { + removeItem: (key: string) => { if (typeof window === 'undefined') return; try { window.localStorage.removeItem(key); diff --git a/libs/storage/README.md b/libs/storage/README.md deleted file mode 100644 index 7370e1c2c..000000000 --- a/libs/storage/README.md +++ /dev/null @@ -1 +0,0 @@ -# Local storage helpers diff --git a/libs/storage/package.json b/libs/storage/package.json deleted file mode 100644 index 8fdea6c2e..000000000 --- a/libs/storage/package.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "name": "@vegaprotocol/storage", - "version": "0.0.1" -} diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-dark.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dark.tsx new file mode 100644 index 000000000..e04b26bc8 --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dark.tsx @@ -0,0 +1,4 @@ +import { ReactElement } from 'react'; +import 'ag-grid-community/dist/styles/ag-theme-balham-dark.css'; + +export const AgGrid = (props: { children: ReactElement }) => props.children; diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic-themed.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic-themed.tsx new file mode 100644 index 000000000..924b5f111 --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic-themed.tsx @@ -0,0 +1,45 @@ +import * as React from 'react'; +import dynamic from 'next/dynamic'; +import type { AgGridReactProps, AgReactUiProps } from 'ag-grid-react'; +import { AgGridReact } from 'ag-grid-react'; +import { ThemeContext } from '@vegaprotocol/react-helpers'; +import 'ag-grid-community/dist/styles/ag-grid.css'; + +const AgGridLightTheme = dynamic<{ children: React.ReactElement }>( + () => import('./ag-grid-light').then((mod) => mod.AgGrid), + { ssr: false } +); + +const AgGridDarkTheme = dynamic<{ children: React.ReactElement }>( + () => import('./ag-grid-dark').then((mod) => mod.AgGrid), + { ssr: false } +); + +export const AgGridThemed = ({ + style, + className, + ...props +}: (AgGridReactProps | AgReactUiProps) & { + style?: React.CSSProperties; + className?: string; +}) => { + const theme = React.useContext(ThemeContext); + return ( +
+ {theme === 'dark' ? ( + + + + ) : ( + + + + )} +
+ ); +}; diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic.tsx new file mode 100644 index 000000000..37eb6e6d9 --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-dynamic.tsx @@ -0,0 +1,15 @@ +import dynamic from 'next/dynamic'; + +import type { AgGridReactProps, AgReactUiProps } from 'ag-grid-react'; + +// https://stackoverflow.com/questions/69433673/nextjs-reactdomserver-does-not-yet-support-suspense +export const AgGridDynamic = dynamic< + (AgGridReactProps | AgReactUiProps) & { + style?: React.CSSProperties; + className?: string; + } +>(() => import('./ag-grid-dynamic-themed').then((mod) => mod.AgGridThemed), { + ssr: false, + // https://nextjs.org/docs/messages/invalid-dynamic-suspense + // suspense: true +}); diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy-themed.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy-themed.tsx new file mode 100644 index 000000000..54da4a860 --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy-themed.tsx @@ -0,0 +1,46 @@ +import * as React from 'react'; +import type { AgGridReactProps, AgReactUiProps } from 'ag-grid-react'; +import { AgGridReact } from 'ag-grid-react'; +import { ThemeContext } from '@vegaprotocol/react-helpers'; +import 'ag-grid-community/dist/styles/ag-grid.css'; + +const AgGridLightTheme = React.lazy(() => + import('./ag-grid-light').then((module) => ({ + default: module.AgGrid, + })) +); + +const AgGridDarkTheme = React.lazy(() => + import('./ag-grid-dark').then((module) => ({ + default: module.AgGrid, + })) +); + +export const AgGridThemed = ({ + style, + className, + ...props +}: (AgGridReactProps | AgReactUiProps) & { + style?: React.CSSProperties; + className?: string; +}) => { + const theme = React.useContext(ThemeContext); + return ( +
+ {theme === 'dark' ? ( + + + + ) : ( + + + + )} +
+ ); +}; diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy.tsx new file mode 100644 index 000000000..9d73d49ad --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-lazy.tsx @@ -0,0 +1,12 @@ +import * as React from 'react'; +import type { AgGridReactProps, AgReactUiProps } from 'ag-grid-react'; + +const LazyAgGridStyled = React.lazy(() => + import('./ag-grid-lazy-themed').then((module) => ({ + default: module.AgGridThemed, + })) +); + +export const AgGridLazy = ( + props: (AgGridReactProps | AgReactUiProps) & { style: React.CSSProperties } +) => ; diff --git a/libs/ui-toolkit/src/components/ag-grid/ag-grid-light.tsx b/libs/ui-toolkit/src/components/ag-grid/ag-grid-light.tsx new file mode 100644 index 000000000..7cf181a0a --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/ag-grid-light.tsx @@ -0,0 +1,4 @@ +import { ReactElement } from 'react'; +import 'ag-grid-community/dist/styles/ag-theme-balham.css'; + +export const AgGrid = (props: { children: ReactElement }) => props.children; diff --git a/libs/ui-toolkit/src/components/ag-grid/index.tsx b/libs/ui-toolkit/src/components/ag-grid/index.tsx new file mode 100644 index 000000000..79f8cc18c --- /dev/null +++ b/libs/ui-toolkit/src/components/ag-grid/index.tsx @@ -0,0 +1,2 @@ +export * from './ag-grid-lazy'; +export * from './ag-grid-dynamic'; diff --git a/libs/ui-toolkit/src/components/dialog/index.tsx b/libs/ui-toolkit/src/components/dialog/index.tsx index 8535d0e78..a966995b8 100644 --- a/libs/ui-toolkit/src/components/dialog/index.tsx +++ b/libs/ui-toolkit/src/components/dialog/index.tsx @@ -12,8 +12,8 @@ export function Dialog({ children, open, setOpen, title }: DialogProps) { return ( setOpen(x)}> - - + + {title &&

{title}

} {children}
diff --git a/libs/ui-toolkit/src/components/input/input.stories.tsx b/libs/ui-toolkit/src/components/input/input.stories.tsx index 21f8a2199..97ff3587d 100644 --- a/libs/ui-toolkit/src/components/input/input.stories.tsx +++ b/libs/ui-toolkit/src/components/input/input.stories.tsx @@ -20,6 +20,16 @@ Disabled.args = { disabled: true, }; +export const TypeDate = Template.bind({}); +TypeDate.args = { + type: 'date', +}; + +export const TypeDateTime = Template.bind({}); +TypeDateTime.args = { + type: 'datetime-local', +}; + export const IconPrepend: Story = () => ( ); diff --git a/libs/ui-toolkit/src/index.ts b/libs/ui-toolkit/src/index.ts index 7bb54ce63..33bac4d9a 100644 --- a/libs/ui-toolkit/src/index.ts +++ b/libs/ui-toolkit/src/index.ts @@ -1,5 +1,6 @@ import * as EthereumUtils from './utils/web3'; +export { AgGridLazy, AgGridDynamic } from './components/ag-grid'; export { Button, AnchorButton } from './components/button'; export { Callout } from './components/callout'; export { EthereumUtils }; diff --git a/libs/storage/.babelrc b/libs/wallet/.babelrc similarity index 100% rename from libs/storage/.babelrc rename to libs/wallet/.babelrc diff --git a/libs/wallet/.eslintrc.json b/libs/wallet/.eslintrc.json new file mode 100644 index 000000000..734ddacee --- /dev/null +++ b/libs/wallet/.eslintrc.json @@ -0,0 +1,18 @@ +{ + "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"], + "ignorePatterns": ["!**/*"], + "overrides": [ + { + "files": ["*.ts", "*.tsx", "*.js", "*.jsx"], + "rules": {} + }, + { + "files": ["*.ts", "*.tsx"], + "rules": {} + }, + { + "files": ["*.js", "*.jsx"], + "rules": {} + } + ] +} diff --git a/libs/wallet/README.md b/libs/wallet/README.md new file mode 100644 index 000000000..d9e11214b --- /dev/null +++ b/libs/wallet/README.md @@ -0,0 +1,7 @@ +# wallet + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test wallet` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/libs/storage/jest.config.js b/libs/wallet/jest.config.js similarity index 67% rename from libs/storage/jest.config.js rename to libs/wallet/jest.config.js index d9a440403..62d2c5046 100644 --- a/libs/storage/jest.config.js +++ b/libs/wallet/jest.config.js @@ -1,9 +1,9 @@ module.exports = { - displayName: 'storage', + displayName: 'wallet', preset: '../../jest.preset.js', transform: { '^.+\\.[tj]sx?$': 'babel-jest', }, moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'], - coverageDirectory: '../../coverage/libs/storage', + coverageDirectory: '../../coverage/libs/wallet', }; diff --git a/libs/wallet/package.json b/libs/wallet/package.json new file mode 100644 index 000000000..53b5de294 --- /dev/null +++ b/libs/wallet/package.json @@ -0,0 +1,4 @@ +{ + "name": "@vegaprotocol/wallet", + "version": "0.0.1" +} diff --git a/libs/storage/project.json b/libs/wallet/project.json similarity index 56% rename from libs/storage/project.json rename to libs/wallet/project.json index a4edb5567..ac8f49f8f 100644 --- a/libs/storage/project.json +++ b/libs/wallet/project.json @@ -1,6 +1,6 @@ { - "root": "libs/storage", - "sourceRoot": "libs/storage/src", + "root": "libs/wallet", + "sourceRoot": "libs/wallet/src", "projectType": "library", "tags": [], "targets": { @@ -8,15 +8,16 @@ "executor": "@nrwl/web:rollup", "outputs": ["{options.outputPath}"], "options": { - "outputPath": "dist/libs/storage", - "tsConfig": "libs/storage/tsconfig.lib.json", - "project": "libs/storage/package.json", - "entryFile": "libs/storage/src/index.js", + "outputPath": "dist/libs/wallet", + "tsConfig": "libs/wallet/tsconfig.lib.json", + "project": "libs/wallet/package.json", + "entryFile": "libs/wallet/src/index.ts", + "external": ["react/jsx-runtime"], "rollupConfig": "@nrwl/react/plugins/bundle-rollup", "compiler": "babel", "assets": [ { - "glob": "libs/storage/README.md", + "glob": "libs/wallet/README.md", "input": ".", "output": "." } @@ -27,14 +28,14 @@ "executor": "@nrwl/linter:eslint", "outputs": ["{options.outputFile}"], "options": { - "lintFilePatterns": ["libs/storage/**/*.{ts,js}"] + "lintFilePatterns": ["libs/wallet/**/*.{ts,tsx,js,jsx}"] } }, "test": { "executor": "@nrwl/jest:jest", - "outputs": ["coverage/libs/storage"], + "outputs": ["coverage/libs/wallet"], "options": { - "jestConfig": "libs/storage/jest.config.js", + "jestConfig": "libs/wallet/jest.config.js", "passWithNoTests": true } } diff --git a/libs/react-helpers/src/lib/vega-wallet/connect-dialog.test.tsx b/libs/wallet/src/connect-dialog.test.tsx similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/connect-dialog.test.tsx rename to libs/wallet/src/connect-dialog.test.tsx diff --git a/libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx b/libs/wallet/src/connect-dialog.tsx similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx rename to libs/wallet/src/connect-dialog.tsx diff --git a/libs/react-helpers/src/lib/vega-wallet/connectors/index.ts b/libs/wallet/src/connectors/index.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/connectors/index.ts rename to libs/wallet/src/connectors/index.ts diff --git a/libs/react-helpers/src/lib/vega-wallet/connectors/injected-connector.ts b/libs/wallet/src/connectors/injected-connector.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/connectors/injected-connector.ts rename to libs/wallet/src/connectors/injected-connector.ts diff --git a/libs/react-helpers/src/lib/vega-wallet/connectors/rest-connector.ts b/libs/wallet/src/connectors/rest-connector.ts similarity index 98% rename from libs/react-helpers/src/lib/vega-wallet/connectors/rest-connector.ts rename to libs/wallet/src/connectors/rest-connector.ts index 09b701b4f..41b93a13a 100644 --- a/libs/react-helpers/src/lib/vega-wallet/connectors/rest-connector.ts +++ b/libs/wallet/src/connectors/rest-connector.ts @@ -4,7 +4,7 @@ import { Configuration, OrderSubmissionBody, } from '@vegaprotocol/vegawallet-service-api-client'; -import { LocalStorage } from '@vegaprotocol/storage'; +import { LocalStorage } from '@vegaprotocol/react-helpers'; import { WALLET_CONFIG } from '../storage-keys'; import { VegaConnector } from '.'; diff --git a/libs/react-helpers/src/lib/vega-wallet/context.ts b/libs/wallet/src/context.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/context.ts rename to libs/wallet/src/context.ts diff --git a/libs/react-helpers/src/lib/vega-wallet/hooks.ts b/libs/wallet/src/hooks.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/hooks.ts rename to libs/wallet/src/hooks.ts diff --git a/libs/react-helpers/src/lib/vega-wallet/index.ts b/libs/wallet/src/index.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/index.ts rename to libs/wallet/src/index.ts diff --git a/libs/react-helpers/src/lib/vega-wallet/provider.test.tsx b/libs/wallet/src/provider.test.tsx similarity index 96% rename from libs/react-helpers/src/lib/vega-wallet/provider.test.tsx rename to libs/wallet/src/provider.test.tsx index 6edf40857..9b3727d4e 100644 --- a/libs/react-helpers/src/lib/vega-wallet/provider.test.tsx +++ b/libs/wallet/src/provider.test.tsx @@ -1,11 +1,5 @@ import '@testing-library/jest-dom'; -import { - act, - fireEvent, - render, - screen, - waitFor, -} from '@testing-library/react'; +import { act, fireEvent, render, screen } from '@testing-library/react'; import { RestConnector } from './connectors'; import { useVegaWallet } from './hooks'; import { VegaWalletProvider } from './provider'; diff --git a/libs/react-helpers/src/lib/vega-wallet/provider.tsx b/libs/wallet/src/provider.tsx similarity index 97% rename from libs/react-helpers/src/lib/vega-wallet/provider.tsx rename to libs/wallet/src/provider.tsx index d2476f4dd..90ff94952 100644 --- a/libs/react-helpers/src/lib/vega-wallet/provider.tsx +++ b/libs/wallet/src/provider.tsx @@ -1,4 +1,4 @@ -import { LocalStorage } from '@vegaprotocol/storage'; +import { LocalStorage } from '@vegaprotocol/react-helpers'; import { ReactNode, useCallback, diff --git a/libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx b/libs/wallet/src/rest-connector-form.tsx similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx rename to libs/wallet/src/rest-connector-form.tsx diff --git a/libs/react-helpers/src/lib/vega-wallet/storage-keys.ts b/libs/wallet/src/storage-keys.ts similarity index 100% rename from libs/react-helpers/src/lib/vega-wallet/storage-keys.ts rename to libs/wallet/src/storage-keys.ts diff --git a/libs/storage/tsconfig.json b/libs/wallet/tsconfig.json similarity index 100% rename from libs/storage/tsconfig.json rename to libs/wallet/tsconfig.json diff --git a/libs/storage/tsconfig.lib.json b/libs/wallet/tsconfig.lib.json similarity index 80% rename from libs/storage/tsconfig.lib.json rename to libs/wallet/tsconfig.lib.json index ad9c3d024..252904bb7 100644 --- a/libs/storage/tsconfig.lib.json +++ b/libs/wallet/tsconfig.lib.json @@ -16,11 +16,7 @@ "**/*.spec.js", "**/*.test.js", "**/*.spec.jsx", - "**/*.test.jsx", - "**/*.stories.ts", - "**/*.stories.js", - "**/*.stories.jsx", - "**/*.stories.tsx" + "**/*.test.jsx" ], "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] } diff --git a/libs/storage/tsconfig.spec.json b/libs/wallet/tsconfig.spec.json similarity index 100% rename from libs/storage/tsconfig.spec.json rename to libs/wallet/tsconfig.spec.json diff --git a/package.json b/package.json index aca10d849..1cf9b813e 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,8 @@ "@sentry/tracing": "^6.18.1", "@types/uuid": "^8.3.4", "@vegaprotocol/vegawallet-service-api-client": "^0.4.6", + "ag-grid-community": "^27.0.1", + "ag-grid-react": "^27.0.1", "apollo": "^2.33.9", "autoprefixer": "^10.4.2", "classnames": "^2.3.1", diff --git a/tsconfig.base.json b/tsconfig.base.json index 8bc40e4e0..646567318 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -16,11 +16,11 @@ "baseUrl": ".", "paths": { "@vegaprotocol/react-helpers": ["libs/react-helpers/src/index.ts"], - "@vegaprotocol/storage": ["libs/storage/src/index.js"], "@vegaprotocol/tailwindcss-config": [ "libs/tailwindcss-config/src/index.js" ], - "@vegaprotocol/ui-toolkit": ["libs/ui-toolkit/src/index.ts"] + "@vegaprotocol/ui-toolkit": ["libs/ui-toolkit/src/index.ts"], + "@vegaprotocol/wallet": ["libs/wallet/src/index.ts"] } }, "exclude": ["node_modules", "tmp"] diff --git a/workspace.json b/workspace.json index a8d4a7cb9..d9027b157 100644 --- a/workspace.json +++ b/workspace.json @@ -4,10 +4,10 @@ "explorer": "apps/explorer", "explorer-e2e": "apps/explorer-e2e", "react-helpers": "libs/react-helpers", - "storage": "libs/storage", "tailwindcss-config": "libs/tailwindcss-config", "trading": "apps/trading", "trading-e2e": "apps/trading-e2e", - "ui-toolkit": "libs/ui-toolkit" + "ui-toolkit": "libs/ui-toolkit", + "wallet": "libs/wallet" } } diff --git a/yarn.lock b/yarn.lock index b1150c226..caf1fb3b4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5589,6 +5589,18 @@ address@^1.0.1: resolved "https://registry.yarnpkg.com/address/-/address-1.1.2.tgz#bf1116c9c758c51b7a933d296b72c221ed9428b6" integrity sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA== +ag-grid-community@^27.0.1: + version "27.0.1" + resolved "https://registry.yarnpkg.com/ag-grid-community/-/ag-grid-community-27.0.1.tgz#7ce5c000d321ba2c22447837e793b1d8366f4cdb" + integrity sha512-wV3CLLJWet0I7lmlVjVjACVWQ1WmGYflEyc2nKK3u5CDKa9ewQGYcwZW92i+E+9rmGH6R7oaL3DFKzNWD6C56w== + +ag-grid-react@^27.0.1: + version "27.0.1" + resolved "https://registry.yarnpkg.com/ag-grid-react/-/ag-grid-react-27.0.1.tgz#138a2f256ee1f24377268adcf3d7c4751c9896db" + integrity sha512-zoqhWT+ZD/l44Ij8HeUEYiI3SsdSWvuKjlnlkB51y3ASqlte2OIMNOZrFe1I23H59Ouhl+kvvQCagEzPvz0Lcg== + dependencies: + prop-types "^15.8.1" + agent-base@6: version "6.0.2" resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-6.0.2.tgz#49fff58577cfee3f37176feab4c22e00f86d7f77"