Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
jessopb committed Feb 13, 2025
1 parent 5a2c960 commit 37207f8
Show file tree
Hide file tree
Showing 10 changed files with 271 additions and 129 deletions.
2 changes: 2 additions & 0 deletions flow-typed/stripe.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ declare type StripeState = {
customerStatusFetching: ?boolean,
customerStatus: any,
customerSetupResponse: ?StripeCustomerSetupResponse,
arAccountUpdating: false,
arAccountUpdatingError: undefined,
};

declare type StripeAccountInfo = {
Expand Down
8 changes: 6 additions & 2 deletions ui/component/commentCreate/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,11 @@ import {
import { getChannelIdFromClaim } from 'util/claim';
import { doOpenModal } from 'redux/actions/app';
import { selectPreferredCurrency } from 'redux/selectors/settings';
import { selectArweaveStatus, selectArweaveTipDataForId, selectCanReceiveFiatTipsForUri } from 'redux/selectors/stripe';
import {
selectFullAPIArweaveStatus,
selectArweaveTipDataForId,
selectCanReceiveFiatTipsForUri,
} from 'redux/selectors/stripe';
import { doTipAccountCheckForUri } from 'redux/actions/stripe';
import {
selectUserHasOdyseePremiumPlus,
Expand Down Expand Up @@ -60,7 +64,7 @@ const select = (state, props) => {
activeChannelUrl,
canReceiveFiatTips: selectCanReceiveFiatTipsForUri(state, uri),
canReceiveArweaveTips: selectArweaveTipDataForId(state, uri),
arweaveStatus: selectArweaveStatus(state),
arweaveStatus: selectFullAPIArweaveStatus(state),
channelClaimId,
chatCommentsRestrictedToChannelMembers: Boolean(selectedRestrictedCommentsChatTagForUri(state, uri)),
claimId,
Expand Down
12 changes: 10 additions & 2 deletions ui/component/walletBalance/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,12 @@ import {
selectPendingMassClaimTxid,
} from 'redux/selectors/wallet';
import { selectArweaveBalance } from 'redux/selectors/arwallet';
import { selectAccountStatus, selectArweaveStatus } from 'redux/selectors/stripe';
import {
selectAccountStatus,
selectAPIArweaveActiveAccount,
selectAPIArweaveActiveAddress,
selectFullAPIArweaveStatus,
} from 'redux/selectors/stripe';
import { doFetchUtxoCounts, doUtxoConsolidate } from 'redux/actions/wallet';
import { doOpenModal } from 'redux/actions/app';
import { selectSyncHash } from 'redux/selectors/sync';
Expand All @@ -25,7 +30,7 @@ const select = (state) => ({
LBCBalance: selectBalance(state),
USDCBalance: selectArweaveBalance(state).usdc,
accountStatus: selectAccountStatus(state),
arweaveStatus: selectArweaveStatus(state),
fullArweaveStatus: selectFullAPIArweaveStatus(state),
claimsBalance: selectClaimsBalance(state) || 0,
supportsBalance: selectSupportsBalance(state) || 0,
tipsBalance: selectTipsBalance(state) || 0,
Expand All @@ -37,6 +42,9 @@ const select = (state) => ({
utxoCounts: selectUtxoCounts(state),
consolidateIsPending: selectPendingConsolidateTxid(state),
massClaimIsPending: selectPendingMassClaimTxid(state),
activeAPIArAccountAddress: selectAPIArweaveActiveAddress(state),
activeAPIArAccount: selectAPIArweaveActiveAccount(state),
arweaveAccountStatus: selectFullAPIArweaveStatus(state),
});

export default connect(select, {
Expand Down
47 changes: 27 additions & 20 deletions ui/component/walletBalance/view.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import I18nMessage from 'component/i18nMessage';
import WalletFiatBalance from 'component/walletFiatBalance';
import { formatNumberWithCommas } from 'util/number';


type Props = {
experimentalUi: boolean,
LBCBalance: number,
Expand All @@ -23,18 +22,20 @@ type Props = {
claimsBalance: number,
supportsBalance: number,
tipsBalance: number,
hasSynced: boolean,
hasSynced: boolean,
fetchingUtxoCounts: boolean,
consolidatingUtxos: boolean,
consolidateIsPending: boolean,
massClaimingTips: boolean,
massClaimIsPending: boolean,
utxoCounts: { [string]: number },
accountStatus: any;
arweaveStatus: any,
accountStatus: any,
fullArweaveStatus: Array<any>,
doOpenModal: (string) => void,
doFetchUtxoCounts: () => void,
doUtxoConsolidate: () => void,
activeAPIArAccountAddress: string,
activeAPIArAccount: any,
};

export const WALLET_CONSOLIDATE_UTXOS = 400;
Expand All @@ -47,37 +48,52 @@ const WalletBalance = (props: Props) => {
USDCBalance,
claimsBalance,
supportsBalance,
tipsBalance,
hasSynced,
tipsBalance,
hasSynced,
consolidatingUtxos,
consolidateIsPending,
massClaimingTips,
massClaimIsPending,
utxoCounts,
accountStatus,
arweaveStatus,
fullArweaveStatus,
doOpenModal,
doUtxoConsolidate,
doFetchUtxoCounts,
activeAPIArAccountAddress,
activeAPIArAccount,
} = props;

const [detailsExpanded, setDetailsExpanded] = React.useState(false);
// stages:
// connected extension
// registered address
// unlocked extension

const [detailsExpanded, setDetailsExpanded] = React.useState(false);

const { other: otherCount = 0 } = utxoCounts || {};
const showArweave = ENABLE_ARCONNECT && experimentalUi;
const totalBalance = LBCBalance + tipsBalance + supportsBalance + claimsBalance;
const totalLocked = tipsBalance + claimsBalance + supportsBalance;
const operationPending = massClaimIsPending || massClaimingTips || consolidateIsPending || consolidatingUtxos;

console.log('accountStatus: ', accountStatus)
console.log('arweaveStatus', arweaveStatus);
//
// console.log('accountStatus: ', accountStatus);
// console.log('arweaveStatus', arweaveStatus);

React.useEffect(() => {
if (LBCBalance > LARGE_WALLET_BALANCE && detailsExpanded) {
doFetchUtxoCounts();
}
}, [doFetchUtxoCounts, LBCBalance, detailsExpanded]);

const getArStatus = () => {
// if ()
// active wander address
// registered active account address
// not locked
// all set
};

return (
<div className={'columns'}>
<div className="column">
Expand Down Expand Up @@ -222,15 +238,6 @@ const WalletBalance = (props: Props) => {
background
actions={
<>
<h2 className="section__title--small">
<I18nMessage
tokens={{
usdc_amount: <Symbol token="usdc" amount={USDCBalance} precision={2} />,
}}
>
%usdc_amount%
</I18nMessage>
</h2>
<div className="section__actions">
<Button
button="secondary"
Expand Down
12 changes: 12 additions & 0 deletions ui/constants/action_types.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,18 @@ export const AR_TIP_STATUS_STARTED = 'AR_TIP_STATUS_STARTED';
export const AR_TIP_STATUS_ERROR = 'AR_TIP_STATUS_ERROR';
export const AR_TIP_STATUS_SUCCESS = 'AR_TIP_STATUS_SUCCESS';

export const AR_ADDR_REGISTER_STARTED = 'AR_ADDR_REGISTER_STARTED';
export const AR_ADDR_REGISTER_SUCCESS = 'AR_ADDR_REGISTER_SUCCESS';
export const AR_ADDR_REGISTER_ERROR = 'AR_ADDR_REGISTER_ERROR';

export const AR_ADDR_UPDATE_STARTED = 'AR_ADDR_UPDATE_STARTED';
export const AR_ADDR_UPDATE_SUCCESS = 'AR_ADDR_UPDATE_SUCCESS';
export const AR_ADDR_UPDATE_ERROR = 'AR_ADDR_UPDATE_ERROR';

export const AR_ADDR_DEFAULT_STARTED = 'AR_ADDR_DEFAULT_STARTED';
export const AR_ADDR_DEFAULT_SUCCESS = 'AR_ADDR_DEFAULT_SUCCESS';
export const AR_ADDR_DEFAULT_ERROR = 'AR_ADDR_DEFAULT_ERROR';

export const GET_NEW_ADDRESS_STARTED = 'GET_NEW_ADDRESS_STARTED';
export const GET_NEW_ADDRESS_COMPLETED = 'GET_NEW_ADDRESS_COMPLETED';
export const FETCH_TRANSACTIONS_STARTED = 'FETCH_TRANSACTIONS_STARTED';
Expand Down
150 changes: 88 additions & 62 deletions ui/page/paymentAccount/view.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const TAB_QUERY = 'tab';
const TABS = {
OVERVIEW: 'overview',
RECEIVE: 'receive',
SEND: 'send',
SEND: 'send',
BUY: 'buy',
WITHDRAW: 'withdraw',
TRANSACTION_HISTORY: 'transaction-history',
Expand Down Expand Up @@ -89,20 +89,29 @@ function PaymentAccountPage(props: Props) {

return (
<Page className="paymentAccountPage-wrapper main--full-width">
<header className="page-header">
</header>
<header className="page-header"></header>
<Tabs onChange={onTabChange} index={tabIndex}>
<div className="tab__wrapper">
<TabList className="tabs__list--collection-edit-page">
<Tab aria-selected={tabIndex === 0} onClick={() => onTabChange(0)}>{__('Overview')}</Tab>
<Tab aria-selected={tabIndex === 1} onClick={() => onTabChange(1)}>{__('Receive')}</Tab>
<Tab aria-selected={tabIndex === 2} onClick={() => onTabChange(2)}>{__('Send')}</Tab>
<Tab aria-selected={tabIndex === 3} onClick={() => onTabChange(3)}>{__('Buy')}</Tab>
<Tab aria-selected={tabIndex === 4} onClick={() => onTabChange(4)}>{__('Withdraw')}</Tab>
</TabList>
<TabList className="tabs__list--collection-edit-page">
<Tab aria-selected={tabIndex === 0} onClick={() => onTabChange(0)}>
{__('Overview')}
</Tab>
<Tab aria-selected={tabIndex === 1} onClick={() => onTabChange(1)}>
{__('Receive')}
</Tab>
<Tab aria-selected={tabIndex === 2} onClick={() => onTabChange(2)}>
{__('Send')}
</Tab>
<Tab aria-selected={tabIndex === 3} onClick={() => onTabChange(3)}>
{__('Buy')}
</Tab>
<Tab aria-selected={tabIndex === 4} onClick={() => onTabChange(4)}>
{__('Withdraw')}
</Tab>
</TabList>
</div>
<TabPanels>
<TabPanel>
<TabPanels>
<TabPanel>
<>
<Card
className={!arWalletStatus ? `card--disabled` : ``}
Expand All @@ -123,51 +132,64 @@ function PaymentAccountPage(props: Props) {
background
actions={
<>
<h2 className="section__title--small">
{__('Transaction history')}
</h2>
<div className="transaction-history">
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Purchase')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token"><Symbol token="usdc" />USDC</div>
<div className="transaction-history__direction">{__('via')}</div>
<div className="transaction-history__target">OnRamp</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Withdraw')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token"><Symbol token="usdc" />USDC</div>
<div className="transaction-history__direction">{__('to')}</div>
<div className="transaction-history__target">0x00000000000000000000</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Receive')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token"><Symbol token="usdc" />USDC</div>
<div className="transaction-history__direction">{__('from')}</div>
<div className="transaction-history__target">0x00000000000000000000</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Send Tip')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token"><Symbol token="usdc" />USDC</div>
<div className="transaction-history__direction">{__('to')}</div>
<div className="transaction-history__target">Username</div>
<h2 className="section__title--small">{__('Transaction history')}</h2>
<div className="transaction-history">
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Purchase')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token">
<Symbol token="usdc" />
USDC
</div>
<div className="transaction-history__direction">{__('via')}</div>
<div className="transaction-history__target">OnRamp</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Withdraw')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token">
<Symbol token="usdc" />
USDC
</div>
<div className="transaction-history__direction">{__('to')}</div>
<div className="transaction-history__target">0x00000000000000000000</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Receive')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token">
<Symbol token="usdc" />
USDC
</div>
<div className="transaction-history__direction">{__('from')}</div>
<div className="transaction-history__target">0x00000000000000000000</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Send Tip')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token">
<Symbol token="usdc" />
USDC
</div>
<div className="transaction-history__direction">{__('to')}</div>
<div className="transaction-history__target">Username</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Receive Tip')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token">
<Symbol token="usdc" />
USDC
</div>
<div className="transaction-history__direction">{__('from')}</div>
<div className="transaction-history__target">Username</div>
</div>
</div>
<div className="transaction-history__row">
<div className="transaction-history__date">xx.xx.xxx</div>
<div className="transaction-history__action">{__('Receive Tip')}</div>
<div className="transaction-history__amount">0.00</div>
<div className="transaction-history__token"><Symbol token="usdc" />USDC</div>
<div className="transaction-history__direction">{__('from')}</div>
<div className="transaction-history__target">Username</div>
</div>
</div>
</>
}
/>
Expand All @@ -177,26 +199,30 @@ function PaymentAccountPage(props: Props) {
</div>
)}
</>
</TabPanel>
</TabPanel>
<TabPanel>
<>
<ReceiveUsdt arWalletStatus={arWalletStatus} balance={balance} handleArConnectDisconnect={handleArConnectDisconnect} />
<ReceiveUsdt
arWalletStatus={arWalletStatus}
balance={balance}
handleArConnectDisconnect={handleArConnectDisconnect}
/>
{!arWalletStatus && (
<div className="wallet">
<WalletConnect />
</div>
)}
</>
</>
</TabPanel>
<TabPanel>
<>
<SendUsdc arWalletStatus={arWalletStatus} balance={balance} />
<SendUsdc arWalletStatus={arWalletStatus} balance={balance} />
{!arWalletStatus && (
<div className="wallet">
<WalletConnect />
</div>
)}
</>
</>
</TabPanel>
<TabPanel>
<>
Expand All @@ -216,7 +242,7 @@ function PaymentAccountPage(props: Props) {
<WalletConnect />
</div>
)}
</>
</>
</TabPanel>
</TabPanels>
</Tabs>
Expand Down
Loading

0 comments on commit 37207f8

Please sign in to comment.