All files / Components/Flyout FlyoutHeader.js

100% Statements 4/4
100% Branches 2/2
100% Functions 1/1
100% Lines 4/4

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      1x       8x   8x   8x                                          
import React, { useContext } from 'react';
import { WebAppsUXContext } from '../../Context';
 
const FlyoutHeader = props => {
    const {
        closeAction,
        children,
    } = props;
 
    const { theme } = useContext(WebAppsUXContext);
 
    return (
        <div className={`flex items-center justify-between p-6 pr-4 bg-gray-100 dark:bg-gray-800 border-b-2 border-${theme}-600`}>
            <div className="text-3xl font-bold tracking-light leading-none">
                {children}
            </div>
            {
                (closeAction)
                    ? (
                        <button className="rounded-md dark:text-gray-400 text-gray-600 focus:outline-none focus:ring-2 focus:ring-white"
                            onClick={closeAction}>
                            <span className="sr-only">Close panel</span>
                            <svg className="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
                                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M6 18L18 6M6 6l12 12" />
                            </svg>
                        </button>
                    ) : null
            }
        </div>
    )
}
 
export default FlyoutHeader;