fix(ProjectSearchBarDialog): getMenuProps error

2024-06-24 22:46:41 +00:00
3 changed files with 21 additions and 45 deletions
@@ -62,7 +62,7 @@ export const ProjectSearchBar = ({ onChange }: ProjectSearchBarProps) => {
    <div className="relative w-full lg:w-fit">
      <SearchBar {...getInputProps()} />
      <div
-        {...getMenuProps({}, { suppressRefError: true })}
+        {...getMenuProps()}
        className={cn(
          'flex flex-col shadow-dropdown rounded-xl bg-surface-card absolute w-[459px] max-h-52 overflow-y-auto px-2 py-2 gap-1 z-50',
          { hidden: !inputValue || !isOpen },
@@ -80,7 +80,7 @@ export const ProjectSearchBarDialog = ({
          <div className="h-full flex flex-col fixed top-0 inset-0">
            <div className="py-2.5 px-4 flex items-center justify-between border-b border-border-separator/[0.06]">
              <Input
-                {...getInputProps({}, { suppressRefError: true })}
+                {...getInputProps()}
                leftIcon={<SearchIcon />}
                placeholder="Search"
                appearance="borderless"
@@ -91,33 +91,23 @@ export const ProjectSearchBarDialog = ({
              </Button>
            </div>
            {/* Content */}
-            <div
-              className="flex flex-col gap-1 px-2 py-2"
-              {...getMenuProps(
-                {},
-                {
-                  suppressRefError: true,
-                },
-              )}
-            >
-              {items.length > 0 ? (
-                <>
-                  <div className="px-2 py-2">
-                    <p className="text-elements-mid-em text-xs font-medium">
-                      Suggestions
-                    </p>
-                  </div>
-                  {items.map((item, index) => (
-                    <ProjectSearchBarItem
-                      key={item.id}
-                      item={item}
-                      {...getItemProps({ item, index })}
-                    />
-                  ))}
-                </>
-              ) : (
-                inputValue && <ProjectSearchBarEmpty />
-              )}
+            <div className="flex flex-col gap-1 px-2 py-2" {...getMenuProps()}>
+              {items.length > 0
+                ? items.map((item, index) => (
+                    <>
+                      <div className="px-2 py-2">
+                        <p className="text-elements-mid-em text-xs font-medium">
+                          Suggestions
+                        </p>
+                      </div>
+                      <ProjectSearchBarItem
+                        key={item.id}
+                        item={item}
+                        {...getItemProps({ item, index })}
+                      />
+                    </>
+                  ))
+                : inputValue && <ProjectSearchBarEmpty />}
            </div>
          </div>
        </Dialog.Content>
@@ -1,19 +1,5 @@
-import { Heading } from 'components/shared/Heading';
-
 const Settings = () => {
-  return (
-    <section className="px-4 md:px-6 py-6 flex flex-col gap-6">
-      {/* Header */}
-      <div className="flex items-center">
-        <div className="grow">
-          <div className="flex gap-4 items-center">
-            <Heading as="h2" className="text-[24px]">
-              Settings
-            </Heading>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
+  return <div className="p-5">Settings page</div>;
 };
+
 export default Settings;