feat: rework homescreen dashboard with search, env switcher, and AI tools panel

- Add inline search input to dashboard that focuses when triggering the
  search command from the library toolbar (replaces VS Code input dialog)
- Add environment switcher button when 2+ environments are configured
- Show folder mode (Dynamic/Fixed) subtitle under the cloud name
- Add gear button in the header bottom row to open the credentials config
- Rework welcome guide to focus on initial setup only; remove MCP/AI tool
  setup guides and simplify to credential configuration steps
- Extract all homescreen inline CSS into media/styles/homescreen.css;
  add additionalStyles support to createWebviewDocument/WebviewDocumentOptions

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: njb90

media/styles/homescreen.css

@@ -9,17 +9,20 @@ import registerClearSearch from "./clearSearch";
 import registerWelcomeScreen from "./welcomeScreen";
 import registerConfigureAiTools from "./configureAiTools";
 import { CloudinaryTreeDataProvider } from "../tree/treeDataProvider";
+import { HomescreenViewProvider } from "../webview/homescreenView";
 
 /**
  * Registers all Cloudinary-related commands with the VS Code command registry.
  * @param context - The extension context.
  * @param provider - The Cloudinary tree data provider.
  * @param statusBar - Status bar item to show current environment.
+ * @param homescreenProvider - The homescreen webview view provider.
  */
 function registerAllCommands(
   context: vscode.ExtensionContext,
   provider: CloudinaryTreeDataProvider,
-  statusBar: vscode.StatusBarItem
+  statusBar: vscode.StatusBarItem,
+  homescreenProvider: HomescreenViewProvider
 ) {
   context.subscriptions.push(
     vscode.commands.registerCommand("cloudinary.showHomescreen", () => {
@@ -45,7 +48,7 @@ function registerAllCommands(
     )
   );
 
-  registerSearch(context, provider);
+  registerSearch(context, provider, homescreenProvider);
   registerClearSearch(context, provider);
   registerViewOptions(context, provider);
   registerPreview(context);

src/commands/registerCommands.ts

@@ -1,28 +1,20 @@
 import * as vscode from "vscode";
 import { CloudinaryTreeDataProvider } from "../tree/treeDataProvider";
+import { HomescreenViewProvider } from "../webview/homescreenView";
 
 /**
- * Registers a command that allows users to search for Cloudinary assets by public ID.
- * @param context - The VS Code extension context.
- * @param provider - Cloudinary tree data provider used to refresh view based on search.
+ * Registers the search command. Opens the dashboard and focuses its search input.
  */
 function registerSearch(
   context: vscode.ExtensionContext,
-  provider: CloudinaryTreeDataProvider
+  _provider: CloudinaryTreeDataProvider,
+  homescreenProvider: HomescreenViewProvider
 ) {
   context.subscriptions.push(
-    vscode.commands.registerCommand("cloudinary.searchAssets", async () => {
-      const query = await vscode.window.showInputBox({
-        placeHolder: "Search for a public id",
-      });
-
-      if (query !== undefined && query.trim() !== "") {
-        provider.refresh({ searchQuery: query.trim() });
-      } else {
-        vscode.window.showErrorMessage("Search query cannot be empty.");
-      }
+    vscode.commands.registerCommand("cloudinary.searchAssets", () => {
+      homescreenProvider.focusSearch();
     })
   );
 }
 
-export default registerSearch;
+export default registerSearch;