From d75c361603dd4369d39c2e2d3664f49f21f003dd Mon Sep 17 00:00:00 2001
From: Flo2410 <florian@hye.dev>
Date: Tue, 30 Jan 2024 20:37:16 +0000
Subject: [PATCH] Added greyed out suggestions to search bar.

---
 src/components/widgets/search/search.jsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/widgets/search/search.jsx b/src/components/widgets/search/search.jsx
index c6b65883..e310e764 100644
--- a/src/components/widgets/search/search.jsx
+++ b/src/components/widgets/search/search.jsx
@@ -231,14 +231,17 @@ export default function Search({ options }) {
                   {searchSuggestions[1].map((suggestion) => (
                     <Combobox.Option key={suggestion} value={suggestion} className="flex w-full">
                       {({ active }) => (
-                        <span
+                        <div
                           className={classNames(
                             "px-2 py-1 rounded-md w-full",
                             active ? "bg-theme-300/20 dark:bg-white/10" : "",
                           )}
                         >
-                          {suggestion}
-                        </span>
+                          <span className="whitespace-pre">{suggestion.indexOf(query) === 0 ? query : ""}</span>
+                          <span className="mr-4 whitespace-pre opacity-50">
+                            {suggestion.indexOf(query) === 0 ? suggestion.substring(query.length) : suggestion}
+                          </span>
+                        </div>
                       )}
                     </Combobox.Option>
                   ))}