content for warehouse. HTML edit works ;
translations
This commit is contained in:
@ -6,6 +6,9 @@ import { GetServerSideProps } from 'next';
|
||||
import { Location, UserRole } from "@prisma/client";
|
||||
import axiosServer from '../../../src/axiosServer';
|
||||
import { useTranslations, createTranslator } from 'next-intl';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
import rehypeRaw from 'rehype-raw';
|
||||
import remarkGfm from 'remark-gfm';
|
||||
// import { getTranslations } from 'next-intl/server';
|
||||
|
||||
const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
@ -54,7 +57,7 @@ const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
className={`tab flex-1 text-lg py-2 px-4 ${activeTab === 'mainLocation' ? 'border-b-4 border-blue-500 text-blue-600 font-semibold' : 'text-gray-600 hover:text-blue-500'}`}
|
||||
onClick={() => handleTabChange('mainLocation')}
|
||||
>
|
||||
{location.name}
|
||||
{location.title || location.name}
|
||||
</button>
|
||||
{/* Backup Location Tab */}
|
||||
{location.backupLocationId !== null && (
|
||||
@ -87,8 +90,27 @@ const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
{/* Tab Content */}
|
||||
{(location.content || location.backupLocationContent) && (
|
||||
<div className="tab-content mt-4">
|
||||
|
||||
{activeTab === 'mainLocation' && (
|
||||
<div className="p-4 bg-white shadow rounded-lg" dangerouslySetInnerHTML={{ __html: location.content }} />
|
||||
|
||||
// <div className="p-4 bg-white shadow rounded-lg" dangerouslySetInnerHTML={{ __html: location.content }} />
|
||||
|
||||
<div className="p-4 bg-white shadow rounded-lg">
|
||||
<ReactMarkdown
|
||||
rehypePlugins={[rehypeRaw]}
|
||||
remarkPlugins={[remarkGfm]}
|
||||
components={{
|
||||
img: ({ node, ...props }) => (
|
||||
<img {...props} className="max-w-full h-auto my-4" alt="" />
|
||||
),
|
||||
a: ({ node, ...props }) => (
|
||||
<a {...props} target="_blank" rel="noopener noreferrer" className="text-blue-600 hover:underline" />
|
||||
)
|
||||
}}
|
||||
>
|
||||
{location.content}
|
||||
</ReactMarkdown>
|
||||
</div>
|
||||
)}
|
||||
{activeTab === 'backupLocation' && location.backupLocationContent && (
|
||||
<div className="p-4 bg-white shadow rounded-lg" dangerouslySetInnerHTML={{ __html: location.backupLocationContent }} />
|
||||
@ -110,7 +132,7 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
const messages = (await import(`../../../content/i18n/${locale}.json`)).default;
|
||||
|
||||
const t = createTranslator({ locale, messages });
|
||||
// Function to replace placeholders in HTML content
|
||||
// Function to replace placeholders in HTML content. Placeholders are in the format {key}
|
||||
const replacePlaceholders = (content: string) => {
|
||||
if (!content) return '';
|
||||
const placeholderPattern = /{([^}]+)}/g;
|
||||
@ -125,7 +147,7 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
return `[${locale}:${key}]`;
|
||||
} catch (error) {
|
||||
// Return formatted placeholder on error
|
||||
return `[${locale}:${key}]`;
|
||||
return `[${locale}:'content.'${key}]`;
|
||||
}
|
||||
});
|
||||
};
|
||||
@ -133,6 +155,7 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
const prismaClient = common.getPrismaClient();
|
||||
const location = await getLocation(prismaClient, context);
|
||||
location.content = replacePlaceholders(location.content);
|
||||
location.title = t("content.location." + location.name + ".title");
|
||||
|
||||
if (location.backupLocationId !== null) {
|
||||
// const { data: backupLocation } = await axios.get(
|
||||
|
Reference in New Issue
Block a user