From 87aaa74fc1f8229dfa06a1d9152e3dbe4f4bcae7 Mon Sep 17 00:00:00 2001
From: Abdellah Hariti <haritiabdellah@gmail.com>
Date: Mon, 27 Jan 2025 20:13:35 +0100
Subject: [PATCH 1/2] search: respect the stored platform on non platform pages
---
app/not-found.tsx | 8 +++++-
src/components/header.tsx | 15 +++++++++--
src/components/home.tsx | 2 +-
src/components/search/index.tsx | 45 ++++++++++++++++++++++++++++-----
4 files changed, 60 insertions(+), 10 deletions(-)
diff --git a/app/not-found.tsx b/app/not-found.tsx
index 4f49a35d4674e..901e6a71adf81 100644
--- a/app/not-found.tsx
+++ b/app/not-found.tsx
@@ -24,7 +24,13 @@ export default function NotFound() {
<div className="max-w-md pt-8">
<p className="pb-4">Let's give it another shot:</p>
- <Search autoFocus path={pathname} searchPlatforms={[]} showChatBot={false} />
+ <Search
+ autoFocus
+ path={pathname}
+ searchPlatforms={[]}
+ showChatBot={false}
+ useStoredSearchPlatforms={false}
+ />
</div>
<div className="pt-8 flex gap-4">
<Button variant="solid" size="3" asChild>
diff --git a/src/components/header.tsx b/src/components/header.tsx
index 7b49913c4aa83..56ae7109533fb 100644
--- a/src/components/header.tsx
+++ b/src/components/header.tsx
@@ -20,9 +20,15 @@ type Props = {
pathname: string;
searchPlatforms: string[];
noSearch?: boolean;
+ useStoredSearchPlatforms?: boolean;
};
-export function Header({pathname, searchPlatforms, noSearch}: Props) {
+export function Header({
+ pathname,
+ searchPlatforms,
+ noSearch,
+ useStoredSearchPlatforms,
+}: Props) {
return (
<header className="bg-[var(--gray-1)] h-[var(--header-height)] w-full z-50 border-b border-[var(--gray-a3)] fixed top-0">
{/* define a header-height variable for consumption by other components */}
@@ -62,7 +68,12 @@ export function Header({pathname, searchPlatforms, noSearch}: Props) {
</Link>
{!noSearch && (
<div className="hidden md:flex justify-center lg:justify-start w-full px-6">
- <Search path={pathname} searchPlatforms={searchPlatforms} showChatBot />
+ <Search
+ path={pathname}
+ searchPlatforms={searchPlatforms}
+ showChatBot
+ useStoredSearchPlatforms={useStoredSearchPlatforms}
+ />
</div>
)}
<div className="hidden lg-xl:flex justify-end flex-1 space-x-2 items-center min-w-fit">
diff --git a/src/components/home.tsx b/src/components/home.tsx
index dd64f065e0ed9..eddaec9dda8f1 100644
--- a/src/components/home.tsx
+++ b/src/components/home.tsx
@@ -21,7 +21,7 @@ import {PlatformFilter} from './platformFilter';
export function Home() {
return (
<div className="tw-app">
- <Header pathname="/" searchPlatforms={[]} />
+ <Header pathname="/" searchPlatforms={[]} useStoredSearchPlatforms={false} />
<div className="mt-[var(--header-height)]">
<Banner />
</div>
diff --git a/src/components/search/index.tsx b/src/components/search/index.tsx
index a5fc3c2f0068e..12f0c78d5ea23 100644
--- a/src/components/search/index.tsx
+++ b/src/components/search/index.tsx
@@ -62,18 +62,50 @@ type Props = {
path?: string;
searchPlatforms?: string[];
showChatBot?: boolean;
+ useStoredSearchPlatforms?: boolean;
};
-export function Search({path, autoFocus, searchPlatforms = [], showChatBot}: Props) {
+const STORAGE_KEY = 'sentry-docs-search-platforms';
+
+export function Search({
+ path,
+ autoFocus,
+ searchPlatforms = [],
+ showChatBot,
+ useStoredSearchPlatforms = true,
+}: Props) {
const ref = useRef<HTMLDivElement>(null);
const [query, setQuery] = useState(``);
const [results, setResults] = useState([] as Result[]);
const [inputFocus, setInputFocus] = useState(false);
const [showOffsiteResults, setShowOffsiteResults] = useState(false);
const [loading, setLoading] = useState(true);
-
+ const [currentSearchPlatforms, setCurrentSearchPlatforms] = useState(searchPlatforms);
const pathname = usePathname();
+ // Load stored platforms on mount
+ useEffect(() => {
+ const storedPlatforms = localStorage.getItem(STORAGE_KEY) ?? '[]';
+ if (!storedPlatforms) {
+ localStorage.setItem(STORAGE_KEY, JSON.stringify(searchPlatforms));
+ } else if (
+ storedPlatforms &&
+ searchPlatforms.length === 0 &&
+ useStoredSearchPlatforms
+ ) {
+ const platforms = JSON.parse(storedPlatforms);
+ setCurrentSearchPlatforms(platforms);
+ }
+ }, [useStoredSearchPlatforms, searchPlatforms]);
+
+ // Update stored platforms when they change
+ useEffect(() => {
+ if (searchPlatforms.length > 0) {
+ localStorage.setItem(STORAGE_KEY, JSON.stringify(searchPlatforms));
+ setCurrentSearchPlatforms(searchPlatforms);
+ }
+ }, [searchPlatforms]);
+
const handleClickOutside = useCallback((ev: MouseEvent) => {
// don't close the search results if the user is clicking the expand button
if (
@@ -143,9 +175,10 @@ export function Search({path, autoFocus, searchPlatforms = [], showChatBot}: Pro
inputQuery,
{
path,
- platforms: searchPlatforms.map(
- platform => standardSDKSlug(platform)?.slug ?? ''
- ),
+ platforms: currentSearchPlatforms.map(platform => {
+ const slug = standardSDKSlug(platform)?.slug ?? '';
+ return slug;
+ }),
searchAllIndexes: showOffsiteResults,
...args,
},
@@ -163,7 +196,7 @@ export function Search({path, autoFocus, searchPlatforms = [], showChatBot}: Pro
setResults(queryResults);
}
},
- [path, searchPlatforms, showOffsiteResults, loading]
+ [path, currentSearchPlatforms, showOffsiteResults, loading]
);
const totalHits = results.reduce((a, x) => a + x.hits.length, 0);
From 9efd110857aa0b82a159ace01eeb47a1a7053b99 Mon Sep 17 00:00:00 2001
From: Abdellah Hariti <haritiabdellah@gmail.com>
Date: Mon, 27 Jan 2025 20:19:38 +0100
Subject: [PATCH 2/2] less diff noise
---
src/components/search/index.tsx | 7 +++----
1 file changed, 3 insertions(+), 4 deletions(-)
diff --git a/src/components/search/index.tsx b/src/components/search/index.tsx
index 12f0c78d5ea23..f7b92c09df5c0 100644
--- a/src/components/search/index.tsx
+++ b/src/components/search/index.tsx
@@ -175,10 +175,9 @@ export function Search({
inputQuery,
{
path,
- platforms: currentSearchPlatforms.map(platform => {
- const slug = standardSDKSlug(platform)?.slug ?? '';
- return slug;
- }),
+ platforms: currentSearchPlatforms.map(
+ platform => standardSDKSlug(platform)?.slug ?? ''
+ ),
searchAllIndexes: showOffsiteResults,
...args,
},