From 274fc210ea57ce06c734a3e7f78716c80ab18957 Mon Sep 17 00:00:00 2001 From: Maximilian Franzke Date: Wed, 17 Sep 2025 11:55:43 +0200 Subject: [PATCH 1/9] refactor: removed obsolete code --- .../src/components/default-component.tsx | 31 +------------------ 1 file changed, 1 insertion(+), 30 deletions(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index bc411c24e0ca..a42a718a6ac0 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useState } from 'react'; +import { useCallback, useState } from 'react'; import { DBCard, DBDivider, DBLink } from '../../../../output/react/src'; import type { ReactDefaultComponentProps, @@ -93,32 +93,6 @@ const DefaultComponent = ({ return ''; }; - const openVariantInNewWindow = ( - event: React.MouseEvent, - variantName: string - ) => { - if ( - typeof globalThis === 'undefined' || - !globalThis.location.origin || - !globalThis.location.href - ) { - return; - } - - const currentUrl = globalThis.location.href.split('?'); - const rawComponentUrl = currentUrl[0]; - const searchParameters = new URLSearchParams(currentUrl[1] ?? ''); - searchParameters.set('page', variantName.toLowerCase()); - - const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; - - const openUrl = componentName - ? `${rawComponentUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}` - : `${currentUrl[0]}?${searchParameters.toString()}`; - - window.open(openUrl, '_blank'); - }; - if (pageName) { const foundVariant = variants.find( (variant) => variant.name.toLowerCase() === pageName @@ -149,9 +123,6 @@ const DefaultComponent = ({ className="link-headline" content="external" target="_blank" - onClick={(event) => { - openVariantInNewWindow(event, variant.name); - }} href={getHref(variant.name)}> {variant.name} From c7867384f0bcbaaa039912dbe166e9842e05483b Mon Sep 17 00:00:00 2001 From: Maximilian Franzke Date: Wed, 17 Sep 2025 13:28:13 +0200 Subject: [PATCH 2/9] refactor: integrated logic out of openVariantInNewWindow to getHref --- .../src/components/default-component.tsx | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index a42a718a6ac0..333641ae3164 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -83,11 +83,18 @@ const DefaultComponent = ({ const getHref = (variantName: string): string => { if (typeof globalThis !== 'undefined') { - const searchParameters = new URLSearchParams( - globalThis?.location?.href.split('?')[1] - ); + const currentUrl = globalThis.location.href.split('?'); + const rawComponentUrl = currentUrl[0]; + const searchParameters = new URLSearchParams(currentUrl[1] ?? ''); searchParameters.set('page', variantName.toLowerCase()); - return `${globalThis?.location?.href.split('?')[0]}?${searchParameters.toString()}`; + + const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; + + if (componentName) { + return `${rawComponentUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}`; + } + + return `${rawComponentUrl}?${searchParameters.toString()}`; } return ''; From 6ea1c73c519d7d6d3715f9b17e9055264009d092 Mon Sep 17 00:00:00 2001 From: Maximilian Franzke Date: Wed, 17 Sep 2025 13:28:51 +0200 Subject: [PATCH 3/9] refactor: restructured --- .../src/components/default-component.tsx | 22 +++++++++---------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index 333641ae3164..0a0eb2b33707 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -82,22 +82,22 @@ const DefaultComponent = ({ const color = useQuery(redirectURLSearchParameters)[2]; const getHref = (variantName: string): string => { - if (typeof globalThis !== 'undefined') { - const currentUrl = globalThis.location.href.split('?'); - const rawComponentUrl = currentUrl[0]; - const searchParameters = new URLSearchParams(currentUrl[1] ?? ''); - searchParameters.set('page', variantName.toLowerCase()); + if (typeof globalThis === 'undefined') { + return ''; + } - const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; + const currentUrl = globalThis.location.href.split('?'); + const rawComponentUrl = currentUrl[0]; + const searchParameters = new URLSearchParams(currentUrl[1] ?? ''); + searchParameters.set('page', variantName.toLowerCase()); - if (componentName) { - return `${rawComponentUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}`; - } + const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; - return `${rawComponentUrl}?${searchParameters.toString()}`; + if (componentName) { + return `${rawComponentUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}`; } - return ''; + return `${rawComponentUrl}?${searchParameters.toString()}`; }; if (pageName) { From fbb386e6483921f81769eb62d5d4d9e7f4d98267 Mon Sep 17 00:00:00 2001 From: Maximilian Franzke <787658+mfranzke@users.noreply.github.com> Date: Mon, 29 Sep 2025 20:42:00 +0200 Subject: [PATCH 4/9] Apply suggestion from @mfranzke --- showcases/react-showcase/src/components/default-component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index 9c5857d9258f..e3775b08a01b 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -115,7 +115,7 @@ const DefaultComponent = ({ const color = useQuery(redirectURLSearchParameters)[2]; const getHref = (variantName: string): string => { - if (typeof globalThis === 'undefined') { + if (typeof globalThis === 'undefined' || !globalThis.location.href) { return ''; } From 8b22297bb0928c8b35f757fab7391895f2ded88b Mon Sep 17 00:00:00 2001 From: Maximilian Franzke <787658+mfranzke@users.noreply.github.com> Date: Thu, 2 Oct 2025 10:57:26 +0200 Subject: [PATCH 5/9] Update showcases/react-showcase/src/components/default-component.tsx Co-authored-by: Michael Kraus --- showcases/react-showcase/src/components/default-component.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index e3775b08a01b..015760ea2dd6 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -177,6 +177,7 @@ const DefaultComponent = ({ className="link-headline" content="external" target="_blank" + rel="noopener noreferrer" href={getHref(variant.name)}> {variant.name} From 810d845d7d65549a791073c0ce18f41acdff4961 Mon Sep 17 00:00:00 2001 From: Maximilian Franzke <787658+mfranzke@users.noreply.github.com> Date: Fri, 17 Oct 2025 12:42:35 +0200 Subject: [PATCH 6/9] Update default-component.tsx --- .../react-showcase/src/components/default-component.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index 015760ea2dd6..83e8f2fe303a 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -119,9 +119,9 @@ const DefaultComponent = ({ return ''; } - const currentUrl = globalThis.location.href.split('?'); - const rawComponentUrl = currentUrl[0]; - const searchParameters = new URLSearchParams(currentUrl[1] ?? ''); + const [baseUrl, query=''] = globalThis.location.href.split('?'); + const rawComponentUrl = baseUrl; + const searchParameters = new URLSearchParams(query); searchParameters.set('page', variantName.toLowerCase()); const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; From 9fffa28a92efe26aec67d2d758726511df856480 Mon Sep 17 00:00:00 2001 From: Maximilian Franzke <787658+mfranzke@users.noreply.github.com> Date: Fri, 17 Oct 2025 13:20:33 +0200 Subject: [PATCH 7/9] Update default-component.tsx --- showcases/react-showcase/src/components/default-component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index 83e8f2fe303a..fc3ade20dfe2 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -119,7 +119,7 @@ const DefaultComponent = ({ return ''; } - const [baseUrl, query=''] = globalThis.location.href.split('?'); + const [baseUrl, query = ''] = globalThis.location.href.split('?'); const rawComponentUrl = baseUrl; const searchParameters = new URLSearchParams(query); searchParameters.set('page', variantName.toLowerCase()); From ade37e5a614a0ceb46d778c6906e8966be5d9f0b Mon Sep 17 00:00:00 2001 From: michaelmkraus Date: Wed, 29 Oct 2025 14:38:36 +0100 Subject: [PATCH 8/9] fix(): prevent crash by guarding window.location in getHref --- .../src/components/default-component.tsx | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/showcases/react-showcase/src/components/default-component.tsx b/showcases/react-showcase/src/components/default-component.tsx index fc3ade20dfe2..80c5e74d035d 100644 --- a/showcases/react-showcase/src/components/default-component.tsx +++ b/showcases/react-showcase/src/components/default-component.tsx @@ -115,22 +115,24 @@ const DefaultComponent = ({ const color = useQuery(redirectURLSearchParameters)[2]; const getHref = (variantName: string): string => { - if (typeof globalThis === 'undefined' || !globalThis.location.href) { - return ''; + if ( + globalThis.window === undefined || + globalThis.location === undefined + ) { + return `?page=${encodeURIComponent(variantName.toLowerCase())}`; } const [baseUrl, query = ''] = globalThis.location.href.split('?'); - const rawComponentUrl = baseUrl; const searchParameters = new URLSearchParams(query); searchParameters.set('page', variantName.toLowerCase()); const regexComponentOverviewFragment = /\/[a-z\d\-_]*\/overview/; if (componentName) { - return `${rawComponentUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}`; + return `${baseUrl.replace(regexComponentOverviewFragment, `/${componentName}/overview`)}?${searchParameters.toString()}`; } - return `${rawComponentUrl}?${searchParameters.toString()}`; + return `${baseUrl}?${searchParameters.toString()}`; }; if (pageName) { From b2d25741a0f3117586eda932734dcaf221dccb66 Mon Sep 17 00:00:00 2001 From: michaelmkraus Date: Wed, 29 Oct 2025 15:00:06 +0100 Subject: [PATCH 9/9] fix(): make useUniversalSearchParameters SSR-safe --- .../src/hooks/use-universal-search-parameters.ts | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/showcases/react-showcase/src/hooks/use-universal-search-parameters.ts b/showcases/react-showcase/src/hooks/use-universal-search-parameters.ts index 28f495557bfb..408da071f897 100644 --- a/showcases/react-showcase/src/hooks/use-universal-search-parameters.ts +++ b/showcases/react-showcase/src/hooks/use-universal-search-parameters.ts @@ -24,10 +24,12 @@ const useUniversalSearchParameters = (): [ : useSearchParams(); const setSearchParameters = (parameters: Record) => { - if (typeof globalThis !== 'undefined') { - const currentParameters = new URLSearchParams( - globalThis.location.href.split('?')[1] - ); + if ( + globalThis.window !== undefined && + globalThis.location !== undefined + ) { + const searchPart = globalThis.location.search || ''; + const currentParameters = new URLSearchParams(searchPart); currentParameters.sort(); const newParameters = new URLSearchParams(parameters); newParameters.sort();