ColumnHeader: remove transparent prop, pass className from Column instead

This commit is contained in:
Alex Gleason 2022-11-30 21:45:31 -06:00
parent f6169b9cf0
commit ae5e4c05f6
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7

View file

@ -7,10 +7,10 @@ import { useSoapboxConfig } from 'soapbox/hooks';
import { Card, CardBody, CardHeader, CardTitle } from '../card/card'; import { Card, CardBody, CardHeader, CardTitle } from '../card/card';
type IColumnHeader = Pick<IColumn, 'label' | 'backHref' |'transparent'>; type IColumnHeader = Pick<IColumn, 'label' | 'backHref' |'className'>;
/** Contains the column title with optional back button. */ /** Contains the column title with optional back button. */
const ColumnHeader: React.FC<IColumnHeader> = ({ label, backHref, transparent }) => { const ColumnHeader: React.FC<IColumnHeader> = ({ label, backHref, className }) => {
const history = useHistory(); const history = useHistory();
const handleBackClick = () => { const handleBackClick = () => {
@ -27,10 +27,7 @@ const ColumnHeader: React.FC<IColumnHeader> = ({ label, backHref, transparent })
}; };
return ( return (
<CardHeader <CardHeader className={className} onBackClick={handleBackClick}>
className={classNames({ 'px-4 pt-4 sm:p-0': transparent })}
onBackClick={handleBackClick}
>
<CardTitle title={label} /> <CardTitle title={label} />
</CardHeader> </CardHeader>
); );
@ -72,7 +69,11 @@ const Column: React.FC<IColumn> = React.forwardRef((props, ref: React.ForwardedR
<Card variant={transparent ? undefined : 'rounded'} className={className}> <Card variant={transparent ? undefined : 'rounded'} className={className}>
{withHeader && ( {withHeader && (
<ColumnHeader label={label} backHref={backHref} transparent={transparent} /> <ColumnHeader
label={label}
backHref={backHref}
className={classNames({ 'px-4 pt-4 sm:p-0': transparent })}
/>
)} )}
<CardBody> <CardBody>