translations in location content, cleanup (commenting
)
This commit is contained in:
Dobromir Popov
@ -1,124 +1,121 @@
|
||||
import Link from "next/link"
|
||||
import { signIn, signOut, useSession } from "next-auth/react"
|
||||
import styles from "../styles/header.module.css"
|
||||
// import Link from "next/link"
|
||||
// import { signIn, signOut, useSession } from "next-auth/react"
|
||||
// import styles from "../styles/header.module.css"
|
||||
|
||||
// The approach used in this component shows how to build a sign in and sign out
|
||||
// component that works on pages which support both client and server side
|
||||
// rendering, and avoids any flash incorrect content on initial page load.
|
||||
export default function Header() {
|
||||
const { data: session, status } = useSession()
|
||||
const loading = status === "loading"
|
||||
// // The approach used in this component shows how to build a sign in and sign out
|
||||
// // component that works on pages which support both client and server side
|
||||
// // rendering, and avoids any flash incorrect content on initial page load.
|
||||
// export default function Header() {
|
||||
// const { data: session, status } = useSession()
|
||||
// const loading = status === "loading"
|
||||
|
||||
//generate top header with sign in/out button and dropdown menu and user name/surname using tailwindcss
|
||||
// //generate top header with sign in/out button and dropdown menu and user name/surname using tailwindcss
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<header className="">
|
||||
<noscript>
|
||||
<style>{`.nojs-show { opacity: 1; top: 0; }`}</style>
|
||||
</noscript>
|
||||
{/* <script src="https://cdn.jsdelivr.net/npm/tw-elements/dist/js/index.min.js"></script> */}
|
||||
<div className={styles.signedInStatus}>
|
||||
<p
|
||||
className={`nojs-show ${
|
||||
!session && loading ? styles.loading : styles.loaded
|
||||
}`}
|
||||
>
|
||||
{!session && (
|
||||
<>
|
||||
<span className={styles.notSignedInText}>
|
||||
You are not signed in
|
||||
</span>
|
||||
<a
|
||||
href={`/api/auth/signin`}
|
||||
className={styles.buttonPrimary}
|
||||
onClick={(e) => {
|
||||
e.preventDefault()
|
||||
signIn()
|
||||
}}
|
||||
>
|
||||
Sign in
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
{session?.user && (
|
||||
<>
|
||||
{session.user.image && (
|
||||
<span
|
||||
style={{ backgroundImage: `url('${session.user.image}')` }}
|
||||
className={styles.avatar}
|
||||
/>
|
||||
)}
|
||||
<span className={styles.signedInText}>
|
||||
<small>Signed in as</small>
|
||||
<br />
|
||||
<strong>{session.user.email ?? session.user.name}</strong>
|
||||
</span>
|
||||
<a
|
||||
href={`/api/auth/signout`}
|
||||
className={styles.button}
|
||||
onClick={(e) => {
|
||||
e.preventDefault()
|
||||
signOut()
|
||||
}}
|
||||
>
|
||||
Sign out
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
<nav className="max-w-7xl mx-auto ">
|
||||
<ul className={styles.navItems}>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/">Home</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/client">Client</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/server">Server</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/protected">Protected</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/api-example">API</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/admin">Admin</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/me">Me</Link>
|
||||
</li>
|
||||
<li className={styles.navItem}>
|
||||
CART
|
||||
{/* cart submenus */}
|
||||
<ul className={styles.submenu}>
|
||||
<li className={styles.submenuItem}>
|
||||
<Link href="/cart/locations">Locations</Link>
|
||||
</li>
|
||||
<li className={styles.submenuItem}>
|
||||
<Link href="/cart/publishers">Publishers</Link>
|
||||
</li>
|
||||
<li className={styles.submenuItem}>
|
||||
<Link href="/cart/availabilities">Availabilities</Link>
|
||||
</li>
|
||||
<li className={styles.submenuItem}>
|
||||
<Link href="/cart/cartevents">Cart Event</Link>
|
||||
</li>
|
||||
</ul>
|
||||
// return (
|
||||
// <header className="">
|
||||
// <noscript>
|
||||
// <style>{`.nojs-show { opacity: 1; top: 0; }`}</style>
|
||||
// </noscript>
|
||||
// {/* <script src="https://cdn.jsdelivr.net/npm/tw-elements/dist/js/index.min.js"></script> */}
|
||||
// <div className={styles.signedInStatus}>
|
||||
// <p className={`nojs-show ${!session && loading ? styles.loading : styles.loaded}`}>
|
||||
// {!session && (
|
||||
// <>
|
||||
// <span className={styles.notSignedInText}>
|
||||
// You are not signed in
|
||||
// </span>
|
||||
// <a
|
||||
// href={`/api/auth/signin`}
|
||||
// className={styles.buttonPrimary}
|
||||
// onClick={(e) => {
|
||||
// e.preventDefault()
|
||||
// signIn()
|
||||
// }}
|
||||
// >
|
||||
// Sign in
|
||||
// </a>
|
||||
// </>
|
||||
// )}
|
||||
// {session?.user && (
|
||||
// <>
|
||||
// {session.user.image && (
|
||||
// <span
|
||||
// style={{ backgroundImage: `url('${session.user.image}')` }}
|
||||
// className={styles.avatar}
|
||||
// />
|
||||
// )}
|
||||
// <span className={styles.signedInText}>
|
||||
// <small>Signed in as</small>
|
||||
// <br />
|
||||
// <strong>{session.user.email ?? session.user.name}</strong>
|
||||
// </span>
|
||||
// <a
|
||||
// href={`/api/auth/signout`}
|
||||
// className={styles.button}
|
||||
// onClick={(e) => {
|
||||
// e.preventDefault()
|
||||
// signOut()
|
||||
// }}
|
||||
// >
|
||||
// Sign out
|
||||
// </a>
|
||||
// </>
|
||||
// )}
|
||||
// </p>
|
||||
// </div>
|
||||
// {/* <nav className="max-w-7xl mx-auto ">
|
||||
// <ul className={styles.navItems}>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/">Home</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/client">Client</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/server">Server</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/protected">Protected</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/api-example">API</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/admin">Admin</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/me">Me</Link>
|
||||
// </li>
|
||||
// <li className={styles.navItem}>
|
||||
// CART
|
||||
// {/* cart submenus * / }
|
||||
// <ul className={styles.submenu}>
|
||||
// <li className={styles.submenuItem}>
|
||||
// <Link href="/cart/locations">Locations</Link>
|
||||
// </li>
|
||||
// <li className={styles.submenuItem}>
|
||||
// <Link href="/cart/publishers">Publishers</Link>
|
||||
// </li>
|
||||
// <li className={styles.submenuItem}>
|
||||
// <Link href="/cart/availabilities">Availabilities</Link>
|
||||
// </li>
|
||||
// <li className={styles.submenuItem}>
|
||||
// <Link href="/cart/cartevents">Cart Event</Link>
|
||||
// </li>
|
||||
// </ul>
|
||||
|
||||
</li>
|
||||
{/* end cart submenus */}
|
||||
// </li>
|
||||
// {/* end cart submenus * / }
|
||||
|
||||
<li className={styles.navItem}>
|
||||
<Link href="/cart/calendar">Calendar</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
// <li className={styles.navItem}>
|
||||
// <Link href="/cart/calendar">Calendar</Link>
|
||||
// </li>
|
||||
// </ul >
|
||||
// </nav > */ }
|
||||
|
||||
// </header >
|
||||
// )
|
||||
// }
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import Header from "./header"
|
||||
|
||||
import Link from 'next/link'
|
||||
import Footer from "./footer"
|
||||
import Sidebar from "./sidebar"
|
||||
|
||||
@ -16,6 +16,7 @@ import { UserRole } from "@prisma/client";
|
||||
const packageVersion = require('../package.json').version;
|
||||
|
||||
function SidebarMenuItem({ item, session, isSubmenu }) {
|
||||
|
||||
// const tMenu = useTranslations('menu');
|
||||
// const [t, locale] = useState(useTranslations('menu'));
|
||||
// useEffect(() => {
|
||||
|
||||
@ -5,6 +5,8 @@ import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a lo
|
||||
import { GetServerSideProps } from 'next';
|
||||
import { Location, UserRole } from "@prisma/client";
|
||||
import axiosServer from '../../../src/axiosServer';
|
||||
import { useTranslations, createTranslator } from 'next-intl';
|
||||
// import { getTranslations } from 'next-intl/server';
|
||||
|
||||
const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
const [activeTab, setActiveTab] = useState('mainLocation');
|
||||
@ -12,6 +14,7 @@ const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
|
||||
const [images, setImages] = useState([]);
|
||||
const [mainLocationImageCount, setMainLocationImageCount] = useState(0);
|
||||
const t = useTranslations('content');
|
||||
|
||||
useEffect(() => {
|
||||
const mainLocationImages = [location.picture1, location.picture2, location.picture3].filter(Boolean);
|
||||
@ -98,15 +101,37 @@ const ViewLocationPage: React.FC<ViewLocationPageProps> = ({ location }) => {
|
||||
export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
const axios = await axiosServer(context);
|
||||
|
||||
// Get the locale from context or use default
|
||||
const locale = context.locale || 'en';
|
||||
const messages = (await import(`../../../content/i18n/${locale}.json`)).default;
|
||||
|
||||
const t = createTranslator({ locale, messages });
|
||||
// Function to replace placeholders in HTML content
|
||||
const replacePlaceholders = (content: string) => {
|
||||
if (!content) return '';
|
||||
const placeholderPattern = /{([^}]+)}/g;
|
||||
return content.replace(placeholderPattern, (match, key) => {
|
||||
try {
|
||||
return t(key);
|
||||
} catch (error) {
|
||||
return match;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
const { data: location } = await axios.get(
|
||||
`${process.env.NEXT_PUBLIC_PUBLIC_URL}/api/data/locations/${context.params.id}`
|
||||
);
|
||||
location.content = replacePlaceholders(location.content);
|
||||
|
||||
if (location.backupLocationId !== null) {
|
||||
const { data: backupLocation } = await axios.get(
|
||||
process.env.NEXT_PUBLIC_PUBLIC_URL + "/api/data/locations/" + location.backupLocationId
|
||||
);
|
||||
location.backupLocationName = backupLocation.name;
|
||||
location.backupLocationContent = backupLocation ? backupLocation.content : "";
|
||||
location.backupLocationContent = backupLocation ? replacePlaceholders(backupLocation.content) : "";
|
||||
location.backupLocationImages = backupLocation ? [backupLocation.picture1, backupLocation.picture2, backupLocation.picture3].filter(Boolean) : [];
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user