tommy
7f2027ca6b
Update QA vars fmt re-map coin type for qa add correct bech32 address as the network-explorer-api was complaining clean up fmt Delegation components Show delegation story on paper Remove actions header from delegations list Add copy to clipboard for delegation list node ids Move tooltip Modals Extract modal styles Fix exports Rewards summary and redeem modal Factor out simple modal Delegations actions modals: delegate, delegate more, undelegate Coin mark and move logo stories Rust types React components handle currency Form field to enter and display an Identity Key Fix up build order Update README Flat buttons End adornment Currency form field Add more props Export components Add currency and mixnode fields Group stories into folders and add flow Change exports from shared packages to stop webpack bundling issues Fix logo import Add mock for tauri api in storybook that shows a console error for operations that are not mocked Delegations views and routes for wallet Delegations list show pending delegations and undelegations wip - delegations page status Add typescript type checking to storybook webpack config and more mocks for tauri Add more interstitial states and confirmation modals Copy change Move config to inside source tree Fix up `Console` typings Add wrapper around Tauri `invoke` that logs operations in development mode wip wip wip ts-rs: remove old files ts-rs: update paths to `ts-packages/types` ts-rs: remove old files ts-rs: export new types to `ts-packages/types` Add `MajorCurrencyAmount` to convert to and from TS types for various backend currency types New crate `nym-types` to provide types for frontend apps (wallet, explorer, etc) wip update type imports and fix some lint errors update packages update type imports update type imports update type imports update type imports start pulling out use of minorMajor and majorMinor update type imports update import Add missing types generated by ts-rs fix types Adding denom to account type updates Handle micro currency denoms Fix type conversion mistake Add clean target eslint: formatting Update React currency components to use `MajorCurrencyAmount` Add separators and extra props to currency components replace currency mapper with denom returning from service Adjust type while generation is broken start integrating new CurrencyFormField component update balance and vesting on client change (not only client address) Fix up conversion from cosmwasm coin to major currency for minor denoms Fix up typings and validations to remove more `Coin` usage fix conflict fix delegations form start fixing validation type update remove console log tidy up remove more unused types remove more unused types Fix `Coin` denom to be `minor` Fix up to minor_cosmos_coin Fix up send Remove `Coin` type Fix up exported types start delegation UI more UI work close actions modal on action select update label fix old delegateion form minor updates undo change to currency in stringD Fix up types Add feature flag for generating typescript Generate types behind feature flag Use custom cli tool to export `ts-rs` types `ts-rs-cli` moves files into place and fix up `Makefile` Update generations target Add missing types for generation Generate typescript types reorder imports use make generate-typescript for new types + type import updates update types Add delegate with everything Add get block to nymd client More conversions Get a big list of delegations with lots of stuff Add `avg_uptime_percent` component api updates ui updates and fixes Add delegation history and pending events Fix up addition Fix up pending delegation event types Filter pending delegation events add history and pending events set total delegations rebase fix breaking type change on delegate page Fix mixnode mapping Add back refresh and set periodic refresh upgrade to react router 6 Add logging Export new types for gas and transactions increase container size! add sendtx type update onOK to return MAjorCurrencyAmount align table items display dash if amount not availble work on delegate and undelegate Make serializable More types Fix up errors align item icon type updates Add operation to get all pending delegation/undelegation events Fix up logging Add more logging Fix undelegate error get pending delegation events remove unused import
Nym MUI Theme
This package provides an extension to the MUI theme system to use Nym branding.
If you are unfamiliar with Material UI theming, please read the following first:
- https://mui.com/customization/theming/
- https://mui.com/customization/palette/
- https://mui.com/customization/dark-mode/#dark-mode-with-custom-palette
Add theme typings to your project
This package also provides a template file to add typings to the theme using Typescript's module augmentation.
Read the following if you are unfamiliar with module augmentation and declaration merging. Then look at the recommendations from Material UI docs for implementation:
- https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation
- https://www.typescriptlang.org/docs/handbook/declaration-merging.html#merging-interfaces
- https://mui.com/customization/palette/#adding-new-colors
Example usage
You can see an example of how to use this theme in react-webpack-with-theme-example:
export const App: React.FC = () => (
<AppContextProvider>
<AppTheme>
<Content />
</AppTheme>
</AppContextProvider>
);
export const AppTheme: React.FC = ({ children }) => {
const { mode } = useAppContext();
return <NymThemeProvider mode={mode}>{children}</NymThemeProvider>;
};
export const Content: React.FC = () => {
...
<Typography sx={{ color: (theme) => theme.palette.nym.networkExplorer.mixnodes.status.active }}>
The quick brown fox jumps over the white fence
</Typography>
...
}
Development
The best way to make changes to the theme is to:
- Run this package in watch mode with
yarn watch - Run Storybook from react-components with
yarn storybook - Make sure the component you are changing is included in the playground
- Watch for changes in the Playground story
Also remember to check light mode and dark mode!
Building
This package should be built from the root of the repository as follows:
yarn
yarn build
Publishing
This package is not published to NPM ... yet.