components ApiKeyInput.tsx

100% Statements 4/4

100% Branches 0/0

100% Functions 2/2

100% Lines 3/3

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34  
 
 
 
 
 
 
 
 
 
 
2x
18x
 
 
 
 
 
 
 
 
 
 
 
 
18x
 
 
 
 
 
 
 
  import { Stack } from "@mui/material";
import GiveText from "@shared/Text/GiveText";
import { styled } from "@theme/v2/Provider";
import CopyButton from "features/Merchants/MerchantSidePanel/GiveMerchantFile/components/CopyButton";
 
interface Props {
  title: string;
  value: string;
  tooltipText?: string;
}
 
const ApiInputItem = ({ title, value, tooltipText }: Props) => {
  return (
    <Stack gap="8px">
      <GiveText variant="bodyS">{title}</GiveText>
      <StyledInput>
        <GiveText variant="bodyS">{value}</GiveText>
        <CopyButton fluidWidth text={value} tooltipText={tooltipText} />
      </StyledInput>
    </Stack>
  );
};
 
export default ApiInputItem;
 
const StyledInput = styled(Stack)(({ theme }) => ({
  padding: "10.2px",
  borderRadius: "12px",
  border: `1px solid ${theme.palette.border?.secondary}`,
  alignItems: "center",
  justifyContent: "space-between",
  flexDirection: "row",
}));