Improve proxy, missing code from last commit

plone · Nov 19, 2024 · ad15951 · ad15951
1 parent c26f77c
commit ad15951
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 13 deletions.
diff --git a/apps/rr7/app/root.tsx b/apps/rr7/app/root.tsx
@@ -7,8 +7,9 @@ import {
   ScrollRestoration,
   useHref,
   useLocation,
-  useNavigate,
+  useNavigate as useRRNavigate,
   useParams,
+  useLoaderData,
 } from 'react-router';
 import type { LinksFunction } from 'react-router';
 
@@ -19,11 +20,21 @@ import { PloneProvider } from '@plone/providers';
 import { flattenToAppURL } from './utils';
 import config from '@plone/registry';
 import install from './config';
+import installSSR from './config.server';
+
+install();
 
 import '@plone/theming/styles/main.css';
 import '@plone/slots/main.css';
 
-install();
+function useNavigate() {
+  const navigate = useRRNavigate();
+  return (to: string) => navigate(flattenToAppURL(to));
+}
+
+function useHrefLocal(to: string) {
+  return useHref(flattenToAppURL(to));
+}
 
 export const links: LinksFunction = () => [
   { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
@@ -38,7 +49,20 @@ export const links: LinksFunction = () => [
   },
 ];
 
+export async function loader() {
+  const ssrConfig = installSSR();
+
+  return {
+    env: {
+      PLONE_API_PATH: ssrConfig.settings.apiPath,
+      PLONE_INTERNAL_API_PATH: ssrConfig.settings.internalApiPath,
+    },
+  };
+}
+
 export function Layout({ children }: { children: React.ReactNode }) {
+  const data = useLoaderData<typeof loader>();
+
   return (
     <html lang="en">
       <head>
@@ -50,13 +74,23 @@ export function Layout({ children }: { children: React.ReactNode }) {
       <body>
         {children}
         <ScrollRestoration />
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `window.env = ${JSON.stringify(data.env)}`,
+          }}
+        />
         <Scripts />
       </body>
     </html>
   );
 }
 
 export default function App() {
+  if (!import.meta.env.SSR) {
+    config.settings.apiPath = window.env.PLONE_API_PATH;
+    config.settings.internalApiPath = window.env.PLONE_INTERNAL_API_PATH;
+  }
+
   const [queryClient] = useState(
     () =>
       new QueryClient({
@@ -76,14 +110,7 @@ export default function App() {
     }),
   );
 
-  const RRNavigate = useNavigate();
-  const navigate = (to: string) => {
-    return RRNavigate(flattenToAppURL(to));
-  };
-
-  function useHrefLocal(to: string) {
-    return useHref(flattenToAppURL(to));
-  }
+  const navigate = useNavigate();
 
   return (
     <PloneProvider

diff --git a/apps/rr7/vite.config.ts b/apps/rr7/vite.config.ts
@@ -3,6 +3,11 @@ import tsconfigPaths from 'vite-tsconfig-paths';
 import { defineConfig } from 'vite';
 import { PloneRegistryVitePlugin } from '@plone/registry/vite-plugin';
 
+const prodServerName =
+  process.env.PLONE_API_PATH && process.env.PLONE_API_PATH.startsWith('https')
+    ? process.env.PLONE_API_PATH
+    : '';
+
 export default defineConfig({
   plugins: [
     reactRouter({
@@ -16,8 +21,13 @@ export default defineConfig({
     port: 3000,
     proxy: {
       '^/\\+\\+api\\+\\+($$|/.*)': {
-        target:
-          'http://localhost:8080/VirtualHostBase/http/localhost:3000/Plone/++api++/VirtualHostRoot',
+        target: prodServerName
+          ? prodServerName
+          : 'http://localhost:8080/VirtualHostBase/http/localhost:3000/Plone/++api++/VirtualHostRoot',
+        ...(prodServerName && {
+          changeOrigin: true,
+          secure: false,
+        }),
         rewrite: (path) => {
           console.log(path);
           return path.replace('/++api++', '');

diff --git a/packages/blocks/Teaser/index.tsx b/packages/blocks/Teaser/index.tsx
@@ -3,7 +3,7 @@ import { Link } from '@plone/components';
 
 const TeaserBlockView = (props: BlockViewProps) => {
   const { data } = props;
-  const href = Array.isArray(data.href) ? data.href[0]['@id'] : data.href;
+  const href = Array.isArray(data.href) ? data.href?.[0]?.['@id'] : data.href;
   const image = data.preview_image?.[0];
   // TODO: Improve the images download path including the ++api++ to avoid having to setup a redirect
   // for @@images and @@download