1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/pages/permissions-connect/snaps/snaps-connect/snaps-connect.stories.js
Hassan Malik ff36e32fb0
[FLASK] Improve snaps connect flow (#19461)
* add todo comments

* add snaps-connect component

* added new messages

* added component scss files to main scss files

* remove dead code and add snap-connect-cell

* update snaps connect

* updated messages and styling

* update messages and css

* update css

* moved snaps privacy warning into snaps connect, moved snaps connect error into snap install

* added story and removed unused import

* fix style linting and move snaps connect error css

* removed unused message

* ran lavamoat policy generation

* fix fencing

* some more css changes

* Fix scrolling and box shadow

* added comment, fixed quote

* Align more with Figma

* Regen LavaMoat policies

* bring back privacy logic to permission page container

* Revert scrolling changes + fix snaps icon

* fix linting, reintroduced dedupe logic and additionally addressed a corner case

* made some fixes

* Fix scrolling with multiple snaps

* add dedupe logic to snaps connect and fix spacing issue

* policy regen

* lint fix

* fix fencing

* replaced with new icon design, trimmed origin urls in certain places

* remove unused imports

* badge icon size

* Revert LM policy changes

* Use SnapAvatar for snaps-connect

* Use InstallError for connection failed

* Delete unused CSS file

* Remove unused CSS

* Use useOriginMetadata

* addressed PR comments

* fix linting errors

* add explicit condition

* fix fencing

* fix some more fencing

* fix util fencing issue

* fix storybook file, prevent null destructuring

* Fix storybook origin URLs

* Fix wrong prop name

---------

Co-authored-by: Frederik Bolding <frederik.bolding@gmail.com>
Co-authored-by: Guillaume Roux <guillaumeroux123@gmail.com>
Co-authored-by: Erik Nilsson <eriks@mail.se>
2023-06-09 10:36:38 -04:00

103 lines
2.2 KiB
JavaScript

import React from 'react';
import { Provider } from 'react-redux';
import configureStore from '../../../../store/store';
import mockState from '../../../../../test/data/mock-state.json';
import SnapsConnect from '.';
const store = configureStore(mockState);
export default {
title: 'Pages/Snaps/SnapConnect',
component: SnapsConnect,
argTypes: {},
decorators: [(story) => <Provider store={store}>{story()}</Provider>],
};
export const DefaultStory = (args) => <SnapsConnect {...args} />;
DefaultStory.storyName = 'Default';
DefaultStory.args = {
request: {
metadata: {
id: 'foo',
},
permissions: {
wallet_snap: {
caveats: [
{
value: {
'npm:@metamask/test-snap-bip44': {},
},
},
],
},
},
},
targetSubjectMetadata: {
origin: 'https://metamask.io',
},
};
export const MultiStory = (args) => <SnapsConnect {...args} />;
MultiStory.storyName = 'Multi';
MultiStory.args = {
request: {
metadata: {
id: 'foo',
},
permissions: {
wallet_snap: {
caveats: [
{
value: {
'npm:@metamask/test-snap-bip44': {},
'npm:@metamask/test-snap-bip32': {},
'npm:@metamask/test-snap-getEntropy': {},
},
},
],
},
},
},
targetSubjectMetadata: {
origin: 'https://metamask.io',
},
};
export const ScrollingStory = (args) => <SnapsConnect {...args} />;
ScrollingStory.storyName = 'Scrolling';
ScrollingStory.args = {
request: {
metadata: {
id: 'foo',
},
permissions: {
wallet_snap: {
caveats: [
{
value: {
'npm:@metamask/test-snap-bip44': {},
'npm:@metamask/test-snap-bip32': {},
'npm:@metamask/test-snap-getEntropy': {},
'npm:@metamask/test-snap-networkAccess': {},
'npm:@metamask/test-snap-wasm': {},
'npm:@metamask/test-snap-notify': {},
'npm:@metamask/test-snap-dialog': {},
},
},
],
},
},
},
targetSubjectMetadata: {
origin: 'https://metamask.io',
},
};