Use null rather than empty string for unspecified namespace

It's possible for (arguably misformed) package metadata to have the
empty string as the namespace. This can happen for example when
ingesting an OCI image that does not have the correct repository URL
specified.

Currently guac-visualiser does not let you pick beyond a namespace
that is the empty string: it would not make the "package name"
dropdown sensitive (although it would correctly populate the options
from the GraphQL response).

This commit updates the "empty" state for the package name option from
the empty string to null (like is used for version). Then update the
`disabled` param to be determined on whether the namespace is null
(rather than the empty string).

Signed-off-by: Ed Baunton <[email protected]>

Author: edbaunton

components/packages/packageSelector.tsx

@@ -22,7 +22,7 @@ export default function PackageSelector({
   resetTypeFunc?: () => void;
 }) {
   const [packageType, setPackageType] = useState("");
-  const [packageNamespace, setPackageNamespace] = useState("");
+  const [packageNamespace, setPackageNamespace] = useState(null);
   const [packageName, setPackageName] = useState("");
   const [packageNamespaces, setPackageNamespaces] = useState(
     INITIAL_PACKAGE_NAMESPACES
@@ -43,7 +43,7 @@ export default function PackageSelector({
 
   const resetType = () => {
     setPackageNamespaces(INITIAL_PACKAGE_NAMESPACES);
-    setPackageNamespace("");
+    setPackageNamespace(null);
     resetNamespace();
     resetTypeFunc();
   };
@@ -82,7 +82,7 @@ export default function PackageSelector({
           setPackageNameFunc={setPackageName}
           setPackageVersionsFunc={setPackageVersions}
           resetNameFunc={resetName}
-          disabled={!packageNamespace}
+          disabled={packageNamespace === null}
         />
       </div>
       <div className="left-0 flex w-full items-end justify-center bg-gradient-to-t lg:static lg:h-auto lg:w-auto lg:bg-none">