my-links/inertia/components/dashboard/collection/header/collection_description.tsx

import styled from '@emotion/styled';
import TextEllipsis from '~/components/common/text_ellipsis';
import useActiveCollection from '~/hooks/use_active_collection';

const CollectionDescriptionStyle = styled.div({
  width: '100%',
  fontSize: '0.85rem',
  marginBottom: '0.5rem',
});

export default function CollectionDescription() {
  const { activeCollection } = useActiveCollection();
  return (
    activeCollection && (
      <CollectionDescriptionStyle>
        <TextEllipsis lines={3}>{activeCollection?.description}</TextEllipsis>
      </CollectionDescriptionStyle>
    )
  );
}