2024-11-03 00:36:02 +01:00

58 lines
1.9 KiB
TypeScript

/* eslint-disable @typescript-eslint/no-unsafe-assignment */
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
/* eslint-disable @typescript-eslint/restrict-template-expressions */
import SocialShareBar from './SocialShareBar'
/* const flags = {
de: (
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 3" className="tw-w-5 tw-h-3">
<rect width="5" height="3" fill="#FFCE00" />
<rect width="5" height="2" fill="#DD0000" />
<rect width="5" height="1" fill="#000000" />
</svg>
),
at: (
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 3" className="tw-w-5 tw-h-3">
<rect width="5" height="3" fill="#ED2939" />
<rect width="5" height="2" fill="#FFFFFF" />
<rect width="5" height="1" fill="#ED2939" />
</svg>
)
}; */
const statusMapping = {
in_planning: 'in Planung',
paused: 'pausiert',
active: 'aktiv',
}
// eslint-disable-next-line react/prop-types
const SubHeader = ({ type, status, url, title }) => (
<div>
<div className='tw-float-left tw-mt-2 tw-mb-4 tw-flex tw-items-center'>
{status && (
<div className='tw-mt-1.5'>
<span className='tw-text-sm tw-text-current tw-bg-base-300 tw-rounded tw-py-0.5 tw-px-2 tw-inline-flex tw-items-center tw-mr-2'>
<span
className={`tw-w-2 tw-h-2 ${status === 'in_planning' && 'tw-bg-blue-700'} ${status === 'paused' && 'tw-bg-orange-400'} ${status === 'active' && 'tw-bg-green-500'} tw-rounded-full tw-mr-1.5`}
></span>
{statusMapping[status]}
</span>
</div>
)}
{type && (
<div className='tw-mt-1.5'>
<span className='tw-text-sm tw-text-current tw-bg-base-300 tw-rounded tw-py-1 tw-px-2'>
{type}
</span>
</div>
)}
</div>
<div>
<SocialShareBar url={url} title={title} />
</div>
</div>
)
export default SubHeader