add manual virtual api key create ui

src/components/resource-selector.tsx

@@ -25,13 +25,19 @@ export type ResourceSelectorProps = {
     selectedResource?: SelectedResource | null;
     onSelectResource: (resource: SelectedResource) => void;
     excludeWildcard?: boolean;
+    showClear?: boolean;
+    onClear?: () => void;
+    protocol?: string;
 };
 
 export function ResourceSelector({
     orgId,
     selectedResource,
     onSelectResource,
-    excludeWildcard = false
+    excludeWildcard = false,
+    showClear = false,
+    onClear,
+    protocol
 }: ResourceSelectorProps) {
     const t = useTranslations();
     const [resourceSearchQuery, setResourceSearchQuery] = useState("");
@@ -42,7 +48,8 @@ export function ResourceSelector({
         orgQueries.proxyResources({
             orgId: orgId,
             query: debouncedSearchQuery,
-            perPage: 10
+            perPage: 10,
+            protocol
         })
     );
 
@@ -75,6 +82,14 @@ export function ResourceSelector({
             <CommandList>
                 <CommandEmpty>{t("resourcesNotFound")}</CommandEmpty>
                 <CommandGroup>
+                    {showClear && onClear && (
+                        <CommandItem
+                            onSelect={onClear}
+                            className="text-muted-foreground"
+                        >
+                            {t("accessFilterClear")}
+                        </CommandItem>
+                    )}
                     {resourcesShown.map((r) => (
                         <CommandItem
                             value={`${r.name}:${r.resourceId}`}