Differential D19604 Diff 58919 cashtab/src/components/Common/WalletHeaderActions.tsx

Changeset View

Standalone View

cashtab/src/components/Common/WalletHeaderActions.tsx

	// Copyright (c) 2024 The Bitcoin developers			// Copyright (c) 2024 The Bitcoin developers
	// Distributed under the MIT software license, see the accompanying			// Distributed under the MIT software license, see the accompanying
	// file COPYING or http://www.opensource.org/licenses/mit-license.php.			// file COPYING or http://www.opensource.org/licenses/mit-license.php.

	import * as React from 'react';			import * as React from 'react';
				import styled from 'styled-components';
				import { Link } from 'react-router';
	import { CopyIconButton } from 'components/Common/Buttons';			import { CopyIconButton } from 'components/Common/Buttons';
	import HideBalanceSwitch from 'components/Common/HideBalanceSwitch';			import HideBalanceSwitch from 'components/Common/HideBalanceSwitch';
	import CashtabSettings from 'config/CashtabSettings';			import CashtabSettings from 'config/CashtabSettings';
	import { UpdateCashtabState } from 'wallet/useWallet';			import { UpdateCashtabState } from 'wallet/useWallet';
				import { ReactComponent as SettingsIcon } from 'assets/settings-icon.svg';

				const ActionsWrapper = styled.div`
				display: flex;
				align-items: center;
				gap: 15px;
				height: 100%;
				flex-shrink: 0;
				`;

				const SettingsLink = styled(Link)`
				flex-shrink: 0;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				cursor: pointer;
				svg {
				height: 20px;
				width: 25px;
				path {
				fill: ${props => props.theme.primaryText};
				}
				}
				@media (hover: hover) {
				&:hover {
				svg path {
				fill: ${props => props.theme.accent};
				}
				}
				}
				`;

	interface WalletHeaderActionsProps {			interface WalletHeaderActionsProps {
	address?: string;			address?: string;
	settings: CashtabSettings;			settings: CashtabSettings;
	updateCashtabState: UpdateCashtabState;			updateCashtabState: UpdateCashtabState;
	}			}

	const WalletHeaderActions: React.FC<WalletHeaderActionsProps> = ({			const WalletHeaderActions: React.FC<WalletHeaderActionsProps> = ({
	address = '',			address = '',
	settings,			settings,
	updateCashtabState,			updateCashtabState,
	}) => {			}) => {
	return (			return (
	<>			<ActionsWrapper>
	<HideBalanceSwitch			<HideBalanceSwitch
	settings={settings}			settings={settings}
	updateCashtabState={updateCashtabState}			updateCashtabState={updateCashtabState}
	/>			/>
	<CopyIconButton			<CopyIconButton
	name={`Copy ${address}`}			name={`Copy ${address}`}
	data={address}			data={address}
	showToast			showToast
	isHeader			isHeader
	/>			/>
	</>			<SettingsLink to="/configure" aria-label="Settings">
				<SettingsIcon title="Settings" />
				</SettingsLink>
				</ActionsWrapper>
	);			);
	};			};

	export default WalletHeaderActions;			export default WalletHeaderActions;