import type { FC } from 'react';
import React from 'react';
import { Button, useToast } from '@theorchard/suite-components';

interface Props {
    identity: {
        id?: string;
        identityId?: string;
        profileId: string;
        profileType: string;
        profileName?: string;
        name?: string;
    };
}

export const CopyHeadersButton: FC<Props> = ({ identity }) => {
    const addToast = useToast();

    const handleCopyClick = () => {
        void navigator.clipboard.writeText(
            JSON.stringify(
                {
                    'orchard-identity-id': identity.identityId ?? identity.id,
                    'orchard-profile-id': identity.profileId,
                    'orchard-profile-type': identity.profileType,
                    'apollographql-client-name': identity.profileName ?? identity.name,
                },
                null,
                2
            )
        );

        addToast('Headers copied to your clipboard');
    };

    return (
        <Button className="CopyHeadersBtn" size="sm" onClick={handleCopyClick}>
            copy headers
        </Button>
    );
};