mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-18 09:20:15 +01:00
📝 feat: Markdown support for Custom Footer links (#2960)
* feat: Add markdown support for custom footer links * fix: Update Footer component with revised ReactMarkdown props * fix: Adjusted footer links and pipe styles for consistent appearance * refactor: remove unused footer.tsx file
This commit is contained in:
parent
08b8ae120e
commit
e9bbf39618
2 changed files with 35 additions and 39 deletions
|
|
@ -1,4 +1,5 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import ReactMarkdown from 'react-markdown';
|
||||||
import { Constants } from 'librechat-data-provider';
|
import { Constants } from 'librechat-data-provider';
|
||||||
import { useGetStartupConfig } from 'librechat-data-provider/react-query';
|
import { useGetStartupConfig } from 'librechat-data-provider/react-query';
|
||||||
import { useLocalize } from '~/hooks';
|
import { useLocalize } from '~/hooks';
|
||||||
|
|
@ -32,22 +33,40 @@ export default function Footer({ className }: { className?: string }) {
|
||||||
</a>
|
</a>
|
||||||
);
|
);
|
||||||
|
|
||||||
const mainContentRender = (
|
const mainContentParts = (
|
||||||
<span>
|
typeof config?.customFooter === 'string'
|
||||||
{typeof config?.customFooter === 'string' ? (
|
? config.customFooter
|
||||||
config.customFooter
|
: '[<LibreChat ' +
|
||||||
) : (
|
Constants.VERSION +
|
||||||
<>
|
'>](https://librechat.ai) - ' +
|
||||||
<a href="https://librechat.ai" target="_blank" rel="noreferrer" className="underline">
|
localize('com_ui_pay_per_call')
|
||||||
{config?.appTitle || 'LibreChat'} {Constants.VERSION}
|
).split('|');
|
||||||
</a>
|
|
||||||
{' - '} {localize('com_ui_new_footer')}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
|
|
||||||
const footerElements = [mainContentRender, privacyPolicyRender, termsOfServiceRender].filter(
|
const mainContentRender = mainContentParts.map((text, index) => (
|
||||||
|
<React.Fragment key={`main-content-part-${index}`}>
|
||||||
|
<ReactMarkdown
|
||||||
|
components={{
|
||||||
|
a: (props) => {
|
||||||
|
const { ['node']: _, href, ...otherProps } = props;
|
||||||
|
return (
|
||||||
|
<a
|
||||||
|
className=" text-gray-600 underline dark:text-gray-300"
|
||||||
|
href={href}
|
||||||
|
target="_blank"
|
||||||
|
rel="noreferrer"
|
||||||
|
{...otherProps}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
p: ({ node, ...props }) => <span {...props} />,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{text.trim()}
|
||||||
|
</ReactMarkdown>
|
||||||
|
</React.Fragment>
|
||||||
|
));
|
||||||
|
|
||||||
|
const footerElements = [...mainContentRender, privacyPolicyRender, termsOfServiceRender].filter(
|
||||||
Boolean,
|
Boolean,
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -55,7 +74,7 @@ export default function Footer({ className }: { className?: string }) {
|
||||||
<div
|
<div
|
||||||
className={
|
className={
|
||||||
className ||
|
className ||
|
||||||
'relative flex items-center justify-center gap-2 px-2 py-2 text-xs text-gray-600 dark:text-gray-300 md:px-[60px]'
|
'relative flex items-center justify-center gap-2 px-2 py-2 text-center text-xs text-gray-600 dark:text-gray-300 md:px-[60px]'
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{footerElements.map((contentRender, index) => {
|
{footerElements.map((contentRender, index) => {
|
||||||
|
|
|
||||||
|
|
@ -1,23 +0,0 @@
|
||||||
import { Constants } from 'librechat-data-provider';
|
|
||||||
import { useGetStartupConfig } from 'librechat-data-provider/react-query';
|
|
||||||
import { useLocalize } from '~/hooks';
|
|
||||||
|
|
||||||
export default function Footer() {
|
|
||||||
const { data: config } = useGetStartupConfig();
|
|
||||||
const localize = useLocalize();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="hidden px-3 pb-1 pt-2 text-center text-xs text-black/50 dark:text-white/50 md:block md:px-4 md:pb-4 md:pt-3">
|
|
||||||
{typeof config?.customFooter === 'string' ? (
|
|
||||||
config.customFooter
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
<a href="https://librechat.ai" target="_blank" rel="noreferrer" className="underline">
|
|
||||||
{config?.appTitle || 'LibreChat'} {Constants.VERSION}
|
|
||||||
</a>
|
|
||||||
{' - '}. {localize('com_ui_pay_per_call')}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue