Skip to content

Commit

Permalink
Release/0.21.0 (#613)
Browse files Browse the repository at this point in the history
* chore: merge from upstream develop (#26)

* release: v0.19.0 (#607)

* release: v0.19.0

* update package-lock

* bump xverse core version to fix fee issue

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

* Build analytics tracking for web-extension (#590)

* Build analytics tracking for web-extension

* Add `/privacy-preferences` screen

* Build analytics tracking for web-extension

* Update mixpanel tracking logic

* Remove unused wallet action name

* Add authorize data collection toggler and popup

* Update tracking logic

* Add translation keys

* Update mixpanel tracking logic

* Remove unused imports

* Make some code changes after PR review, upgrade `xverse-core` package version

* Upgrade `xverse-core` package version

* Resolve git conflicts

* Handling fees with thresholds (#601)

* Handling fees with thresholds

* Add margin under the high fees warning

* Change the high fees warning position for Ordinals & Brc-20 txs

* Show the warning if the initial fee from transaction is greater than the threshold

* Add high fee warning for one-step brc20 transfer

* update copy

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

* Refactor ledger-related logic (#586)

* Add STX support for Ledger accounts

* Update the copy and ledger account import logic

* Update the ledger account import logic for STX support

* Add `/add-stx-address-ledger` route for adding stx account

* Remove the old case handling when there is no `ordinalsAddress`

* Add STX address verification with ledger device

* Remove the `/send-stx-ledger` path and update `/send-stx` to handle ledger

* Handle regular STX transactions

* Remove unused `/review-ledger-stx-tx` path, add STX NFT handling

* Remove `/review-ledger-ft-tx` and `/send-ft-ledger` routes, update `/send-ft` to support ledger

* Enable STX auth requests for ledger accounts that have an STX address

* Add link to the auth popup  to add the STX Ledger account

* Update screen UI for STX NFT sending

* Update copy for STX incoming tx signing

* Update STX message signing logic

* Update STX-related logic for ledger accounts

* Update error handling for STX message signing with ledger

* Get rid of `findLedgerAccountId` ledger util, move more copy to locales

* Fix cropped button container for tx signing popup

* Update address index definition for adding stx address

* Update address index definition for address verification and stx tx confirmation

* Update address index definition for stx jwt auth

* Refactor ledger-related logic

* Refactor ledger account import

* Fix ledger account import when both BTC and STX options are selected

* Refactor ledger address verification screen

* Refactor ledger tx confirmation screen

* Refactor Add stx address screen

* Fix `unsignedTx` type

* Add `StacksRecipient` type and make some small code fixes

* Add `icon` prop for the `ActionButton` component

* Change the ledger steps in a callback

* Add types for ledger tx state objects

* Fix account index for stx account import, update ledger tx types and utils

* Change the import path for `StacksRecipient`

* Change the steps numeration for ledger account import

* Get rid of unused step changing logic for ledger account import

* Add more error handling

* Update xverse-core version for testing purposes

* Remove caret symbol in xverse-core package

* Fix CI build

* Make a couple of code fixes according to PR review comments

* Add more transaltions

* Add the `DEFAULT_TRANSITION_OPTIONS` constant

* Make separate components for Steps and StepControls for the Ledger account import flow

* Fix style imports

* Upgrade the `xverse-core` package version

* Upgrade `xverse-core` package version

* Disable PSBT tx signing for ledger accounts

* update xverse-core

* package-lock

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

---------

Co-authored-by: Yukan <yukanliao@gmail.com>
Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

* chore: allow ci build version to pass env vars to build (#27)

* feat/eng 2904 implement frontend on web extension (#5)

* Tim/eng 2933 implement dashboard display of rare sats bundles (#1)

* chore: create a hook for rare sats with placeholder data

* chore: add some inscription placeholder with image

* feat/eng 2933 implement dashboard rare sats tab (#4)

* chore: create a collectiblesTabs component with react-tabs

* refactor: move nft dashboard logic into hook

* feat: move rare sats into separate tab

* fix: add tab state styling and move to common.styled

* feat: style collectibles header

* fix: restyle all grid item colors and add total items

* fix: supply total nfts and total rare sats number

and type the collectiblesTabs props

* style: comments

* feat/eng 2934 implement sats bundle UI screen (#6)

* Abdulhaseeb/eng 2930 implement settings screen updates (#7)

* feat: enable rare sats from settings

* fix: disabled UI

* fix: typos

* Abdulhaseeb/eng 2931 implement info dialogs (#8)

* feat: enable rare sats from settings

* feat: notice alert and rarities screen

* feat: new feature dialog

* fix: styles

* feat: add UI for rare sats bundle in collectible item details (#2)

* fix: ordinal thumbnails were broken (#10)

* Add no collectibles and error screens (#11)

* feat: integrate rare sats form core (#9)

* feat: add rare sats item detail screen (#3)

* feat: add UI for rare sats bundle in collectible item details

* feat: implement rare sats details screen

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* feat: implement rare sats send screen (#12)

* chore: use getUtxoOrdinalBundle to know if a inscription belongs to a bundle (#14)

* Abdulhaseeb/eng 2938 implement rare sats confirm screen (#15)

* feat: confirm rare sat tx

* feat: added warning callout

* feat: implement UI for rare sats thumbnails (#16)

* feat: add UI for rare sats bundle in collectible item details

* feat: implement rare sats details screen

* feat: add rare sats thumbnathumbnails

* chore: add missing mock data for testing inscriptions belonging to a bundle

* Tim/eng 2959 set up test mocks (#17)

* fix: react console errors

* fix: send rare sat heading and sub text

* fix: eslint errors

* chore: add mock test cases in hook

* fix: back button sometimes has no history

* fix: revert merge change

* fix: should be no commoners in mock tests

* feat: added thumbnail in confirm screen (#18)

* fix: react console errors

* fix: send rare sat heading and sub text

* fix: eslint errors

* chore: add mock test cases in hook

* fix: back button sometimes has no history

* fix: revert merge change

* fix: should be no commoners in mock tests

* feat: added thumbnail in confirm screen

* fix: ui

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: rarities screen UI (#19)

* chore: fix some todos and issues in rare sats feature (#20)

* chore: Unify assets and rarity label in rarityTile and rareSatIcon components

* chore: create bundle asset and use it in RareSatsTabGridItem and confirm send screen

* chore: add bundle asset component in send screen

* chore: make glow optional and remove it from inscribed rare sats asset

* chore: add assets to bundle gallery view

* chore: remove unsupported media callout. add margin bottom and fix cannot send rare sat individually for gallery view

* fix: styling on gallery view for dashboard and rare sats bundle grids (#22)

* fix: styling on gallery view for dashboard and rare sats bundle grids

* fix: add column layout for rare sats bundle gallery view

* fix: rare sats bundle back should always fo to gallery

* fix: header spacing rare sats bundle and load more button

* feat: add isLoading state for rare sats tab

* fix: remove is owned by active account check

the user flow resets whenever account changes, so this check is no
longer necessary

* feat: save collectibles tab index in query params

* fix: restore ledger open in new tab behaviour

* fix: show info panel regardless of empty state (#23)

* chore: fix UI issues (#24)

* chore: fix issues with dont see your rare sat banner

* chore: fix ui issues in rare sats details screen

* Update src/app/screens/nftDashboard/notice.tsx

* refactor: use library components and minor styling fixes

* fix: rare sat bundle send button width

* fix: add separator in gallery view rare sats bundle and styling fixes

* fix: minor style fix

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: branch merge errors

* chore: remove mock data (#28)

* chore: remove mock data

* chore: add extenral links to scan tool and rare sats post

* chore: move external link urls to constants file

---------

Co-authored-by: Abdul Haseeb <haseeb4239@gmail.com>
Co-authored-by: fede erbes <fedeerbes@gmail.com>
Co-authored-by: Victor Kirov <victor.kirov@gmail.com>

* release v0.20.0 (#29)

* release: v0.19.0 (#607)

* release: v0.19.0

* update package-lock

* bump xverse core version to fix fee issue

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

* Build analytics tracking for web-extension (#590)

* Build analytics tracking for web-extension

* Add `/privacy-preferences` screen

* Build analytics tracking for web-extension

* Update mixpanel tracking logic

* Remove unused wallet action name

* Add authorize data collection toggler and popup

* Update tracking logic

* Add translation keys

* Update mixpanel tracking logic

* Remove unused imports

* Make some code changes after PR review, upgrade `xverse-core` package version

* Upgrade `xverse-core` package version

* Resolve git conflicts

* Handling fees with thresholds (#601)

* Handling fees with thresholds

* Add margin under the high fees warning

* Change the high fees warning position for Ordinals & Brc-20 txs

* Show the warning if the initial fee from transaction is greater than the threshold

* Add high fee warning for one-step brc20 transfer

* update copy

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

* Refactor ledger-related logic (#586)

* Add STX support for Ledger accounts

* Update the copy and ledger account import logic

* Update the ledger account import logic for STX support

* Add `/add-stx-address-ledger` route for adding stx account

* Remove the old case handling when there is no `ordinalsAddress`

* Add STX address verification with ledger device

* Remove the `/send-stx-ledger` path and update `/send-stx` to handle ledger

* Handle regular STX transactions

* Remove unused `/review-ledger-stx-tx` path, add STX NFT handling

* Remove `/review-ledger-ft-tx` and `/send-ft-ledger` routes, update `/send-ft` to support ledger

* Enable STX auth requests for ledger accounts that have an STX address

* Add link to the auth popup  to add the STX Ledger account

* Update screen UI for STX NFT sending

* Update copy for STX incoming tx signing

* Update STX message signing logic

* Update STX-related logic for ledger accounts

* Update error handling for STX message signing with ledger

* Get rid of `findLedgerAccountId` ledger util, move more copy to locales

* Fix cropped button container for tx signing popup

* Update address index definition for adding stx address

* Update address index definition for address verification and stx tx confirmation

* Update address index definition for stx jwt auth

* Refactor ledger-related logic

* Refactor ledger account import

* Fix ledger account import when both BTC and STX options are selected

* Refactor ledger address verification screen

* Refactor ledger tx confirmation screen

* Refactor Add stx address screen

* Fix `unsignedTx` type

* Add `StacksRecipient` type and make some small code fixes

* Add `icon` prop for the `ActionButton` component

* Change the ledger steps in a callback

* Add types for ledger tx state objects

* Fix account index for stx account import, update ledger tx types and utils

* Change the import path for `StacksRecipient`

* Change the steps numeration for ledger account import

* Get rid of unused step changing logic for ledger account import

* Add more error handling

* Update xverse-core version for testing purposes

* Remove caret symbol in xverse-core package

* Fix CI build

* Make a couple of code fixes according to PR review comments

* Add more transaltions

* Add the `DEFAULT_TRANSITION_OPTIONS` constant

* Make separate components for Steps and StepControls for the Ledger account import flow

* Fix style imports

* Upgrade the `xverse-core` package version

* Upgrade `xverse-core` package version

* Disable PSBT tx signing for ledger accounts

* update xverse-core

* package-lock

---------

Co-authored-by: Yukan <yukanliao@gmail.com>

* release v0.20.0

* chore: bump to xverse-core 1.8.2 for bip322 signing fix

* fix: collectibles dashboard should ignore invalid params errors (#33)

* fix: put in a quick fix for more location.state serialization bugs (#34)

* chore: add support for rare sats in tx confirmation screen (#35)

* chore: add support for rare sats in tx confirmation screen

* chore: remove logs and fix typo

* chore: change unknown icon

---------

Co-authored-by: Tim Man <timothyc.man@gmail.com>
Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>
Co-authored-by: Tim Man <tim@secretkeylabs.com>
Co-authored-by: fede erbes <fedeerbes@gmail.com>

* chore: tidy up zips of each build run and the release uploads (#31)

* feat: collectibles ui frontend (#30)

* [ENG-2836] feat: Ordinals and BRC-20 collectibles UI

* Improve ordinals & brc-20 collectibles fetching logic and UI

* Collectible ordinal detail page (#32)

* Tim/eng 2933 implement dashboard display of rare sats bundles (#1)

* chore: create a hook for rare sats with placeholder data

* chore: add some inscription placeholder with image

* feat/eng 2933 implement dashboard rare sats tab (#4)

* chore: create a collectiblesTabs component with react-tabs

* refactor: move nft dashboard logic into hook

* feat: move rare sats into separate tab

* fix: add tab state styling and move to common.styled

* feat: style collectibles header

* fix: restyle all grid item colors and add total items

* fix: supply total nfts and total rare sats number

and type the collectiblesTabs props

* style: comments

* feat/eng 2934 implement sats bundle UI screen (#6)

* Abdulhaseeb/eng 2930 implement settings screen updates (#7)

* feat: enable rare sats from settings

* fix: disabled UI

* fix: typos

* Abdulhaseeb/eng 2931 implement info dialogs (#8)

* feat: enable rare sats from settings

* feat: notice alert and rarities screen

* feat: new feature dialog

* fix: styles

* feat: add UI for rare sats bundle in collectible item details (#2)

* fix: ordinal thumbnails were broken (#10)

* Add no collectibles and error screens (#11)

* feat: integrate rare sats form core (#9)

* feat: add rare sats item detail screen (#3)

* feat: add UI for rare sats bundle in collectible item details

* feat: implement rare sats details screen

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* feat: implement rare sats send screen (#12)

* chore: use getUtxoOrdinalBundle to know if a inscription belongs to a bundle (#14)

* Abdulhaseeb/eng 2938 implement rare sats confirm screen (#15)

* feat: confirm rare sat tx

* feat: added warning callout

* feat: implement UI for rare sats thumbnails (#16)

* feat: add UI for rare sats bundle in collectible item details

* feat: implement rare sats details screen

* feat: add rare sats thumbnathumbnails

* chore: add missing mock data for testing inscriptions belonging to a bundle

* Tim/eng 2959 set up test mocks (#17)

* fix: react console errors

* fix: send rare sat heading and sub text

* fix: eslint errors

* chore: add mock test cases in hook

* fix: back button sometimes has no history

* fix: revert merge change

* fix: should be no commoners in mock tests

* feat: added thumbnail in confirm screen (#18)

* fix: react console errors

* fix: send rare sat heading and sub text

* fix: eslint errors

* chore: add mock test cases in hook

* fix: back button sometimes has no history

* fix: revert merge change

* fix: should be no commoners in mock tests

* feat: added thumbnail in confirm screen

* fix: ui

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: rarities screen UI (#19)

* chore: fix some todos and issues in rare sats feature (#20)

* chore: Unify assets and rarity label in rarityTile and rareSatIcon components

* chore: create bundle asset and use it in RareSatsTabGridItem and confirm send screen

* chore: add bundle asset component in send screen

* chore: make glow optional and remove it from inscribed rare sats asset

* chore: add assets to bundle gallery view

* chore: remove unsupported media callout. add margin bottom and fix cannot send rare sat individually for gallery view

* fix: styling on gallery view for dashboard and rare sats bundle grids (#22)

* fix: styling on gallery view for dashboard and rare sats bundle grids

* fix: add column layout for rare sats bundle gallery view

* fix: rare sats bundle back should always fo to gallery

* fix: header spacing rare sats bundle and load more button

* feat: add isLoading state for rare sats tab

* fix: remove is owned by active account check

the user flow resets whenever account changes, so this check is no
longer necessary

* feat: save collectibles tab index in query params

* fix: restore ledger open in new tab behaviour

* fix: show info panel regardless of empty state (#23)

* Add ordinal attributes in detail screen

* chore: fix UI issues (#24)

* chore: fix issues with dont see your rare sat banner

* chore: fix ui issues in rare sats details screen

* Update src/app/screens/nftDashboard/notice.tsx

* refactor: use library components and minor styling fixes

* fix: rare sat bundle send button width

* fix: add separator in gallery view rare sats bundle and styling fixes

* fix: minor style fix

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: branch merge errors

* chore: remove mock data (#28)

* chore: remove mock data

* chore: add extenral links to scan tool and rare sats post

* chore: move external link urls to constants file

* Add scrollbar to ordinal detail screen

* Adjust text alignment

* Update Navigation Bar

* Add Share button in extension ordinal detail screen

* Include useInscription hook

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>
Co-authored-by: Abdul Haseeb <haseeb4239@gmail.com>
Co-authored-by: fede erbes <fedeerbes@gmail.com>
Co-authored-by: Victor Kirov <victor.kirov@gmail.com>

* Fix `getNextPageParam` param in the `useAddressInscriptionCollections` hook

* feat: inscriptions collection page UI components (#36)

* chore: use xverse-core with api functions

* feat: add ordinals collection screen and route

* chore: add prettier organize imports plugin

* chore: remove unused eslint disable line

* fix: fix tab query params

* feat: add ordinals collection route and screen

* fix: revert scrollbar change

* Tim/eng 2813 inscriptions collection page data fetching pagination (#37)

* Make some small code tweaks

* Complete Remaining Todos for Ordinal Detail Screen (#38)

* Update ordinal detail Ui accodrding to MVP

* Get ordinal details from api

* Have placeholder incase market data does not exist

* Fix navigation and address comments

* feat: collection grid items (#39)

* Add content skeleton loader for Collectibles tab

* Fix border radius for Collectibles skeleton loader

* Fix the loader condition in Collectibles tab

* Update BRC20 token collection thumbnail in main collectible page

* Tim/eng 2833 inscriptions full screen responsive main page collection (#41)

* feat: style the send screen including responsive layout

* style: use theme radius

Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

---------

Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

* Display collection market data (#40)

* Get collection amrket data

* Fix alignment on collection page

* chore: revert the large package-lock.json diff

* Update receive screen and bottom modal (#42)

* Update recieve screen

* Add updated QR code in recieve screen

* Update receive modal

* Fix getNextPageParam for const useAddressInscriptionCollections = () => {

* Remove unused package

* fix: use theme radius

Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

* fix: use theme radius

Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

* Address comments

* chore: remove empty unreferenced component

* Remove unused background color

* fix: layout and spacing on updated bottom modal, receive nft

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>
Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>

* fix color for custom switch and code typo (#43)

* unstaged package-lock.json

* fix: update all custom switch colors

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: inscriptions grid fixes (#44)

* chore: bump core version to 1.9.1

* Update function to recognise and parse brc20 tokens (#46)

* Update skeleton loader logic for Collectibles UI (#45)

* Update skeleton loader logic for Collectibles UI

* Add a separate `TilesSkeletonLoader` component, add skeleton loader on the Collection page

* Add ordinal detail page skeleton loader for the extension view

* Add skeleton loader for the ordinal image component

* fix: collectibles fixes from review (#47)

* Fix minor ui bugs in collectible screen (#48)

---------

Co-authored-by: Imamah-Zafar <88320460+Imamah-Zafar@users.noreply.github.com>
Co-authored-by: Tim Man <tim@secretkeylabs.com>
Co-authored-by: Abdul Haseeb <haseeb4239@gmail.com>
Co-authored-by: fede erbes <fedeerbes@gmail.com>
Co-authored-by: Victor Kirov <victor.kirov@gmail.com>
Co-authored-by: Duska.T <55587184+DuskaT021@users.noreply.github.com>

* release: v0.21.0

* Small fixes for the Collectibles UI loading state (#50)

* Small fixes for the Collectibles UI

* Fix loader appearance in the Collectibles tabs

* Fix skeleton loader on the main Collectibles tab gallery view

* Fix skeleton loader on the Collection page gallery view

* Add skeleton loader for the ordinal detail page

* fix: container padding on ordinals collection page

* chore: remove debug lines

---------

Co-authored-by: Tim Man <tim@secretkeylabs.com>

* fix: more collectible UI fixes (#52)

* chore: remove testAddress and TODOs

* fix: brc20 status in ordinal details

* fix: back button from nft details goes to nfts tab

and back button from ordinal detail says back to collection or gallery

* Minor ui fixes (#51)

* sort brc20 inscription array

* Fix styling

* Remove unused funciton

---------

Co-authored-by: Yukan <yukanliao@gmail.com>
Co-authored-by: Den <36603049+dhriaznov@users.noreply.github.com>
Co-authored-by: Abdul Haseeb <haseeb4239@gmail.com>
Co-authored-by: fede erbes <fedeerbes@gmail.com>
Co-authored-by: Victor Kirov <victor.kirov@gmail.com>
Co-authored-by: Imamah-Zafar <88320460+Imamah-Zafar@users.noreply.github.com>
Co-authored-by: Duska.T <55587184+DuskaT021@users.noreply.github.com>
  • Loading branch information
8 people committed Oct 11, 2023
1 parent f3219e4 commit 5743c8d
Show file tree
Hide file tree
Showing 71 changed files with 5,268 additions and 3,637 deletions.
6 changes: 2 additions & 4 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -33,14 +33,12 @@ jobs:
run: |
BRANCH_NAME=$(echo ${{ github.head_ref }} | sed 's/\//-/')
GIT_SHA_SHORT=$(git rev-parse --short ${{ github.sha }})
echo "FILENAME=xverse-extension.$BRANCH_NAME.$GIT_SHA_SHORT.zip" >> $GITHUB_ENV
- name: Create Archive
run: zip -r build.zip ./build
echo "FILENAME=xverse-extension.$BRANCH_NAME.$GIT_SHA_SHORT" >> $GITHUB_ENV
- name: Upload Archive
uses: actions/upload-artifact@v3
with:
name: ${{ env.FILENAME }}
path: build.zip
path: ./build
retention-days: 30
if-no-files-found: error
comment-on-pr:
Expand Down
7 changes: 1 addition & 6 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
Expand Up @@ -35,12 +35,7 @@ jobs:
echo "FILENAME=xverse-extension.$(echo ${{github.ref_name}}| sed 's/\//-/').zip" >> $GITHUB_OUTPUT
- name: Create Archive
run: |
zip -r build.zip ./build
- name: Upload Archive
uses: actions/upload-artifact@v3
with:
name: ${{ steps.save-filename.outputs.FILENAME }}
path: build.zip
zip -rj build.zip ./build
- name: Upload Release Asset
if: ${{ github.event.release.upload_url }}
uses: actions/upload-release-asset@v1
Expand Down
2 changes: 2 additions & 0 deletions .prettierrc.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
{
"plugins": ["prettier-plugin-organize-imports"],
"organizeImportsSkipDestructiveCodeActions": true,
"arrowParens": "always",
"bracketSpacing": true,
"jsxBracketSameLine": false,
Expand Down
4,917 changes: 2,412 additions & 2,505 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "xverse-web-extension",
"description": "A Bitcoin wallet for Web3",
"version": "0.20.0",
"version": "0.21.0",
"private": true,
"dependencies": {
"@ledgerhq/hw-transport-webusb": "^6.27.13",
Expand Down Expand Up @@ -36,6 +36,7 @@
"nanoid": "^4.0.0",
"p-queue": "^7.3.4",
"process": "^0.11.10",
"qr-code-styling": "^1.5.0",
"rc-image": "^5.14.0",
"react": "^18.2.0",
"react-content-loader": "^6.2.0",
Expand Down Expand Up @@ -135,6 +136,7 @@
"lint-staged": "^13.2.3",
"path": "^0.12.7",
"prettier": "^2.7.1",
"prettier-plugin-organize-imports": "^3.2.3",
"react-refresh": "^0.14.0",
"react-refresh-typescript": "^2.0.7",
"rimraf": "^3.0.2 ",
Expand Down
13 changes: 11 additions & 2 deletions src/app/components/barLoader/index.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import ContentLoader from 'react-content-loader';
import { LoaderSize } from '@utils/constants';
import ContentLoader from 'react-content-loader';
import styled from 'styled-components';
import Theme from 'theme';

Expand Down Expand Up @@ -72,7 +72,15 @@ export default BarLoader;
const StyledContentLoader = styled(ContentLoader)`
padding: ${(props) => props.theme.spacing(1)}px;
`;
export function BetterBarLoader({ width, height }: { width: number; height: number }) {
export function BetterBarLoader({
width,
height,
className,
}: {
width: number;
height: number;
className?: string;
}) {
return (
<StyledContentLoader
animate
Expand All @@ -83,6 +91,7 @@ export function BetterBarLoader({ width, height }: { width: number; height: numb
viewBox={`0 0 ${width} ${height}`}
backgroundColor={Theme.colors.elevation3}
foregroundColor={Theme.colors.grey}
className={className}
>
<rect y="0" x="0" rx="2" ry="2" width={width} height={height} />
</StyledContentLoader>
Expand Down
4 changes: 2 additions & 2 deletions src/app/components/bottomModal/index.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import Modal from 'react-modal';
import styled, { useTheme } from 'styled-components';
import Cross from '@assets/img/dashboard/X.svg';
import Separator from '@components/separator';
import Modal from 'react-modal';
import styled, { useTheme } from 'styled-components';

const BottomModalHeaderText = styled.h1((props) => ({
...props.theme.body_bold_m,
Expand Down
20 changes: 17 additions & 3 deletions src/app/components/button/index.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import styled from 'styled-components';
import { MoonLoader } from 'react-spinners';
import styled from 'styled-components';

interface ButtonProps {
disabled?: boolean;
Expand Down Expand Up @@ -79,6 +79,7 @@ const ButtonIconContainer = styled.div((props) => ({
}));

interface Props {
className?: string;
src?: string;
icon?: JSX.Element;
text: string;
Expand All @@ -87,9 +88,11 @@ interface Props {
disabled?: boolean;
transparent?: boolean;
warning?: boolean;
hoverDialogId?: string;
}

function ActionButton({
className,
src,
icon,
text,
Expand All @@ -98,6 +101,7 @@ function ActionButton({
disabled = false,
transparent,
warning,
hoverDialogId,
}: Props) {
const handleOnPress = () => {
if (!disabled) {
Expand All @@ -107,7 +111,12 @@ function ActionButton({

if (transparent) {
return (
<TransparentButton onClick={handleOnPress} disabled={disabled || processing}>
<TransparentButton
id={hoverDialogId}
className={className}
onClick={handleOnPress}
disabled={disabled || processing}
>
{processing ? (
<MoonLoader color="white" size={10} />
) : (
Expand All @@ -122,7 +131,12 @@ function ActionButton({
}

return (
<Button onClick={handleOnPress} disabled={disabled || processing} warning={warning}>
<Button
className={className}
onClick={handleOnPress}
disabled={disabled || processing}
warning={warning}
>
{processing ? (
<MoonLoader color="#12151E" size={12} />
) : (
Expand Down
98 changes: 98 additions & 0 deletions src/app/components/collectibleDetailTile/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
import { BetterBarLoader } from '@components/barLoader';
import { useMemo } from 'react';
import { NumericFormat } from 'react-number-format';
import styled from 'styled-components';

interface DetailSectionProps {
isGallery: boolean;
}
const DescriptionHeadingText = styled.p<DetailSectionProps>((props) => ({
...props.theme.body_medium_m,
color: props.theme.colors.white['400'],
marginBottom: props.theme.spacing(2),
whiteSpace: 'nowrap',
textAlign: props.isGallery ? 'right' : 'left',
}));

const DescriptionValueText = styled.p<DetailSectionProps>((props) => ({
...props.theme.body_medium_m,
wordWrap: 'break-word',
color: props.theme.colors.white['0'],
textAlign: !props.isGallery ? 'left' : 'right',
maxWidth: 375,
}));

interface ContainerProps {
isColumnAlignment?: boolean;
}

const Container = styled.div<ContainerProps>((props) => ({
display: 'flex',
flexDirection: props.isColumnAlignment ? 'column' : 'row',
width: '100%',
justifyContent: 'space-between',
}));

const ValueContainer = styled.h1<DetailSectionProps>((props) => ({
marginLeft: props.isGallery ? props.theme.spacing(6) : 0,
marginBottom: props.isGallery ? props.theme.spacing(6) : props.theme.spacing(8),
}));

const LoaderContainer = styled.div<DetailSectionProps>((props) => ({
display: 'flex',
justifyContent: props.isGallery ? 'flex-end' : 'flex-start',
}));

const StyledBarLoader = styled(BetterBarLoader)`
padding: 0;
border-radius: 8px;
`;

interface Props {
title: string;
value: string;
allowThousandSeperator?: boolean;
suffixValue?: string;
isColumnAlignment?: boolean;
isLoading?: boolean;
}

function CollectibleDetailTile({
title,
value,
allowThousandSeperator,
suffixValue,
isColumnAlignment,
isLoading = false,
}: Props) {
const isGalleryOpen: boolean = useMemo(() => document.documentElement.clientWidth > 360, []);

return (
<Container isColumnAlignment={!isGalleryOpen || isColumnAlignment}>
<DescriptionHeadingText isGallery={isGalleryOpen}>{title}</DescriptionHeadingText>
<ValueContainer isGallery={isGalleryOpen}>
{isLoading && (
<LoaderContainer isGallery={isGalleryOpen}>
<StyledBarLoader width={100} height={18.5} />
</LoaderContainer>
)}
{!isLoading && allowThousandSeperator && (
<NumericFormat
value={value}
displayType="text"
thousandSeparator
renderText={(text) => (
<DescriptionValueText isGallery={isGalleryOpen}>{text}</DescriptionValueText>
)}
suffix={suffixValue ? ` ${suffixValue}` : ''}
/>
)}
{!isLoading && !allowThousandSeperator && (
<DescriptionValueText isGallery={isGalleryOpen}>{value}</DescriptionValueText>
)}
</ValueContainer>
</Container>
);
}

export default CollectibleDetailTile;
4 changes: 3 additions & 1 deletion src/app/components/rareSatAsset/rareSatAsset.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ const InscriptionContainer = styled.div`
width: 100%;
height: 100%;
position: relative;
border-radius: 8px;
overflow: hidden;
`;

const RareSatIconContainer = styled.div<{ isGallery: boolean }>((props) => ({
Expand Down Expand Up @@ -53,7 +55,7 @@ function RareSatAsset({ item, isCollage = false }: Props) {
<Container>
{isInscription ? (
<InscriptionContainer>
{!isCollage && item.rarity_ranking !== 'common' && (
{!isCollage && !!item.rarity_ranking && item.rarity_ranking !== 'common' && (
<RareSatIconContainer isGallery={isGallery}>
<RareSatIcon
type={item.rarity_ranking}
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/rareSatIcon/rareSatIcon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import Mythic from '@assets/img/nftDashboard/rareSats/mythic.svg';
import Rare from '@assets/img/nftDashboard/rareSats/rare.svg';
import Uncommon from '@assets/img/nftDashboard/rareSats/uncommon.svg';
import Unknown from '@assets/img/nftDashboard/rareSats/unknown.svg';
import { RareSatsType, getRareSatsColorsByRareSatsType } from '@utils/rareSats';
import { getRareSatsColorsByRareSatsType, RareSatsType } from '@utils/rareSats';
import styled from 'styled-components';

import Theme from '../../../theme';
Expand Down
25 changes: 13 additions & 12 deletions src/app/components/receiveCardComponent/index.tsx
Original file line number Diff line number Diff line change
@@ -1,30 +1,29 @@
import styled from 'styled-components';
import { Tooltip } from 'react-tooltip';
import 'react-tooltip/dist/react-tooltip.css';
import { getShortTruncatedAddress } from '@utils/helper';
import Copy from '@assets/img/nftDashboard/Copy.svg';
import QrCode from '@assets/img/nftDashboard/QrCode.svg';
import { useTranslation } from 'react-i18next';
import { ReactNode } from 'react';
import ActionButton from '@components/button';
import { getShortTruncatedAddress } from '@utils/helper';
import { ReactNode } from 'react';
import { useTranslation } from 'react-i18next';
import { Tooltip } from 'react-tooltip';
import 'react-tooltip/dist/react-tooltip.css';
import styled from 'styled-components';

const ReceiveCard = styled.div((props) => ({
background: props.theme.colors.background.elevation3,
background: props.theme.colors.background.elevation6_600,
borderRadius: props.theme.radius(2),
width: 328,
height: 104,
padding: props.theme.spacing(8),
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
marginBottom: props.theme.spacing(6),
}));

const Button = styled.button((props) => ({
background: '#3F4263',
background: props.theme.colors.elevation6,
borderRadius: props.theme.radius(7),
width: 44,
height: 44,
width: 40,
height: 40,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
Expand Down Expand Up @@ -72,6 +71,7 @@ const VerifyButtonContainer = styled.div({
});

interface Props {
className?: string;
title: string;
address: string;
onQrAddressClick: () => void;
Expand All @@ -82,6 +82,7 @@ interface Props {
}

function ReceiveCardComponent({
className,
children,
title,
address,
Expand All @@ -102,7 +103,7 @@ function ReceiveCardComponent({
};

return (
<ReceiveCard>
<ReceiveCard className={className}>
<ColumnContainer>
{children}
<TitleText>{title}</TitleText>
Expand Down
13 changes: 5 additions & 8 deletions src/app/components/separator/index.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,9 @@
import styled from 'styled-components';

const Line = styled.div((props) => ({
border: `0.5px solid ${props.theme.colors.background.elevation3}`,
marginTop: props.theme.spacing(8),
}));

function Separator() {
return <Line />;
}
export const Separator = styled.hr`
margin-top: ${(props) => props.theme.space.m};
border: none;
border-top: 1px solid ${(props) => props.theme.colors.elevation3};
`;

export default Separator;
Loading

0 comments on commit 5743c8d

Please sign in to comment.