Merge pull request continuedev#4757 from continuedev/tomasz/fix-accounts-bug

Fix accounts bug

Author: sestinj

core/config/ConfigHandler.ts

@@ -387,16 +387,6 @@ export class ConfigHandler {
       this.ideSettingsPromise,
     );
 
-    // After login, default to the first org as the selected org
-    try {
-      const orgs = await this.controlPlaneClient.listOrganizations();
-      if (orgs.length) {
-        await this.setSelectedOrgId(orgs[0].id);
-      }
-    } catch (e) {
-      console.error("Failed to fetch control plane profiles: ", e);
-    }
-
     this.fetchControlPlaneProfiles().catch(async (e) => {
       console.error("Failed to fetch control plane profiles: ", e);
       await this.loadLocalProfilesOnly();

gui/src/pages/config/AccountManagement.tsx

@@ -0,0 +1,150 @@
+import { Listbox, Transition } from "@headlessui/react";
+import {
+  ArrowTopRightOnSquareIcon,
+  ChevronUpDownIcon,
+  PlusCircleIcon,
+} from "@heroicons/react/24/outline";
+import { Fragment, useContext } from "react";
+import AssistantIcon from "../../components/modelSelection/platform/AssistantIcon";
+import { useAuth } from "../../context/Auth";
+import { IdeMessengerContext } from "../../context/IdeMessenger";
+import { useAppDispatch } from "../../redux/hooks";
+import { selectProfileThunk } from "../../redux/thunks/profileAndOrg";
+import { ScopeSelect } from "./ScopeSelect";
+
+export function AccountManagement({ hubEnabled }: { hubEnabled: boolean }) {
+  const dispatch = useAppDispatch();
+  const ideMessenger = useContext(IdeMessengerContext);
+
+  const { session, login, profiles, selectedProfile, selectedOrganization } =
+    useAuth();
+
+  const changeProfileId = (id: string) => {
+    dispatch(selectProfileThunk(id));
+  };
+
+  function handleOpenConfig() {
+    if (!selectedProfile) {
+      return;
+    }
+    ideMessenger.post("config/openProfile", {
+      profileId: selectedProfile.id,
+    });
+  }
+
+  return (
+    <div className="flex flex-col">
+      <div className="flex max-w-[400px] flex-col gap-4 py-6">
+        <h2 className="mb-1 mt-0">Configuration</h2>
+        {hubEnabled ? (
+          // Hub: show org selector
+          session && (
+            <div className="flex flex-col gap-1.5">
+              <span className="text-lightgray text-sm">{`Organization`}</span>
+              <ScopeSelect />
+            </div>
+          )
+        ) : (
+          // Continue for teams: show org text
+          <div>You are using Continue for Teams</div>
+        )}
+
+        {profiles ? (
+          <>
+            <div className="flex flex-col gap-1.5">
+              <div className="flex items-center justify-between gap-1.5 text-sm">
+                <span className="text-lightgray">{`${hubEnabled ? "Assistant" : "Profile"}`}</span>
+              </div>
+              <Listbox value={selectedProfile?.id} onChange={changeProfileId}>
+                {({ open }) => (
+                  <div className="relative w-full">
+                    <Listbox.Button className="border-vsc-input-border bg-vsc-background hover:bg-vsc-input-background text-vsc-foreground relative m-0 flex w-full cursor-pointer items-center justify-between rounded-md border border-solid px-3 py-2 text-left">
+                      <div className="flex items-center gap-2">
+                        {selectedProfile && (
+                          <AssistantIcon assistant={selectedProfile} />
+                        )}
+                        <span className="lines lines-1">
+                          {selectedProfile?.title ?? "No Assistant Selected"}
+                        </span>
+                      </div>
+                      <div className="pointer-events-none flex items-center">
+                        <ChevronUpDownIcon
+                          className="h-5 w-5"
+                          aria-hidden="true"
+                        />
+                      </div>
+                    </Listbox.Button>
+
+                    <Transition
+                      as={Fragment}
+                      show={open}
+                      enter="transition ease-out duration-100"
+                      enterFrom="transform opacity-0 scale-95"
+                      enterTo="transform opacity-100 scale-100"
+                      leave="transition ease-in duration-75"
+                      leaveFrom="transform opacity-100 scale-100"
+                      leaveTo="transform opacity-0 scale-95"
+                    >
+                      <Listbox.Options className="bg-vsc-background max-h-80vh absolute z-50 mt-0.5 w-full overflow-y-scroll rounded-sm p-0">
+                        {profiles.map((option, idx) => (
+                          <Listbox.Option
+                            key={idx}
+                            value={option.id}
+                            className={`text-vsc-foreground hover:text-list-active-foreground flex cursor-pointer flex-row items-center gap-3 px-3 py-2 ${selectedProfile?.id === option.id ? "bg-list-active" : "bg-vsc-input-background"}`}
+                          >
+                            <AssistantIcon assistant={option} />
+                            <span className="lines lines-1 relative flex h-5 items-center justify-between gap-3 pr-2 text-xs">
+                              {option.title}
+                            </span>
+                          </Listbox.Option>
+                        ))}
+                        {hubEnabled && (
+                          <Listbox.Option
+                            key={"no-profiles"}
+                            value={null}
+                            className={`text-vsc-foreground hover:bg-list-active bg-vsc-input-background flex cursor-pointer flex-row items-center gap-2 px-3 py-2`}
+                            onClick={() => {
+                              if (session) {
+                                ideMessenger.post("controlPlane/openUrl", {
+                                  path: "new",
+                                  orgSlug: selectedOrganization?.slug,
+                                });
+                              } else {
+                                login(false);
+                              }
+                            }}
+                          >
+                            <PlusCircleIcon className="h-4 w-4" />
+                            <span className="lines lines-1 flex items-center justify-between text-xs">
+                              Create new Assistant
+                            </span>
+                          </Listbox.Option>
+                        )}
+                      </Listbox.Options>
+                    </Transition>
+
+                    {selectedProfile && (
+                      <div className="mt-3 flex w-full justify-center">
+                        <span
+                          className="text-lightgray flex cursor-pointer items-center gap-1 hover:underline"
+                          onClick={handleOpenConfig}
+                        >
+                          <ArrowTopRightOnSquareIcon className="h-4 w-4" />
+                          {hubEnabled
+                            ? "Open Assistant configuration"
+                            : "View Workspace"}
+                        </span>
+                      </div>
+                    )}
+                  </div>
+                )}
+              </Listbox>
+            </div>
+          </>
+        ) : (
+          <div>Loading...</div>
+        )}
+      </div>
+    </div>
+  );
+}

gui/src/pages/config/index.tsx

@@ -1,24 +1,16 @@
 import { ModelRole } from "@continuedev/config-yaml";
-import { Listbox, Transition } from "@headlessui/react";
-import {
-  ArrowTopRightOnSquareIcon,
-  CheckIcon,
-  ChevronUpDownIcon,
-  PlusCircleIcon,
-  XMarkIcon,
-} from "@heroicons/react/24/outline";
+import { CheckIcon, XMarkIcon } from "@heroicons/react/24/outline";
 import { ModelDescription } from "core";
 import {
   SharedConfigSchema,
   modifyAnyConfigWithSharedConfig,
 } from "core/config/sharedConfig";
-import { Fragment, useContext, useEffect, useState } from "react";
+import { useContext, useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { Input } from "../../components";
 import NumberInput from "../../components/gui/NumberInput";
 import { Select } from "../../components/gui/Select";
 import ToggleSwitch from "../../components/gui/Switch";
-import AssistantIcon from "../../components/modelSelection/platform/AssistantIcon";
 import PageHeader from "../../components/PageHeader";
 import { useAuth } from "../../context/Auth";
 import { IdeMessengerContext } from "../../context/IdeMessenger";
@@ -29,31 +21,18 @@ import {
   setDefaultModel,
   updateConfig,
 } from "../../redux/slices/configSlice";
-import { selectProfileThunk } from "../../redux/thunks/profileAndOrg";
 import { getFontSize, isJetBrains } from "../../util";
 import { AccountButton } from "./AccountButton";
+import { AccountManagement } from "./AccountManagement";
 import ModelRoleSelector from "./ModelRoleSelector";
-import { ScopeSelect } from "./ScopeSelect";
 
 function ConfigPage() {
   useNavigationListener();
   const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const ideMessenger = useContext(IdeMessengerContext);
 
-  const {
-    session,
-    logout,
-    login,
-    profiles,
-    selectedProfile,
-    controlServerBetaEnabled,
-    selectedOrganization,
-  } = useAuth();
-
-  const changeProfileId = (id: string) => {
-    dispatch(selectProfileThunk(id));
-  };
+  const { selectedProfile, controlServerBetaEnabled } = useAuth();
 
   const [hubEnabled, setHubEnabled] = useState(false);
   useEffect(() => {
@@ -62,15 +41,6 @@ function ConfigPage() {
     });
   }, [ideMessenger]);
 
-  function handleOpenConfig() {
-    if (!selectedProfile) {
-      return;
-    }
-    ideMessenger.post("config/openProfile", {
-      profileId: selectedProfile.id,
-    });
-  }
-
   // NOTE Hub takes priority over Continue for Teams
   // Since teams will be moving to hub, not vice versa
 
@@ -161,23 +131,6 @@ function ConfigPage() {
     setFormDisableAutocomplete(disableAutocompleteInFiles);
   }, [disableAutocompleteInFiles]);
 
-  // Workspace prompts
-  const promptPath = config.experimental?.promptPath || "";
-  const [formPromptPath, setFormPromptPath] = useState(promptPath);
-  const cancelChangePromptPath = () => {
-    setFormPromptPath(promptPath);
-  };
-  const handleSubmitPromptPath = () => {
-    handleUpdate({
-      promptPath: formPromptPath || "",
-    });
-  };
-
-  useEffect(() => {
-    // Necessary so that reformatted/trimmed values don't cause dirty state
-    setFormPromptPath(promptPath);
-  }, [promptPath]);
-
   const jetbrains = isJetBrains();
 
   return (
@@ -190,123 +143,7 @@ function ConfigPage() {
       />
 
       <div className="divide-x-0 divide-y-2 divide-solid divide-zinc-700 px-4">
-        <div className="flex flex-col">
-          <div className="flex max-w-[400px] flex-col gap-4 py-6">
-            <h2 className="mb-1 mt-0">Configuration</h2>
-            {hubEnabled ? (
-              // Hub: show org selector
-              session && (
-                <div className="flex flex-col gap-1.5">
-                  <span className="text-lightgray text-sm">{`Organization`}</span>
-                  <ScopeSelect />
-                </div>
-              )
-            ) : (
-              // Continue for teams: show org text
-              <div>You are using Continue for Teams</div>
-            )}
-
-            {profiles ? (
-              <>
-                <div className="flex flex-col gap-1.5">
-                  <div className="flex items-center justify-between gap-1.5 text-sm">
-                    <span className="text-lightgray">{`${hubEnabled ? "Assistant" : "Profile"}`}</span>
-                  </div>
-                  <Listbox
-                    value={selectedProfile?.id}
-                    onChange={changeProfileId}
-                  >
-                    {({ open }) => (
-                      <div className="relative w-full">
-                        <Listbox.Button className="border-vsc-input-border bg-vsc-background hover:bg-vsc-input-background text-vsc-foreground relative m-0 flex w-full cursor-pointer items-center justify-between rounded-md border border-solid px-3 py-2 text-left">
-                          <div className="flex items-center gap-2">
-                            {selectedProfile && (
-                              <AssistantIcon assistant={selectedProfile} />
-                            )}
-                            <span className="lines lines-1">
-                              {selectedProfile?.title ??
-                                "No Assistant Selected"}
-                            </span>
-                          </div>
-                          <div className="pointer-events-none flex items-center">
-                            <ChevronUpDownIcon
-                              className="h-5 w-5"
-                              aria-hidden="true"
-                            />
-                          </div>
-                        </Listbox.Button>
-
-                        <Transition
-                          as={Fragment}
-                          show={open}
-                          enter="transition ease-out duration-100"
-                          enterFrom="transform opacity-0 scale-95"
-                          enterTo="transform opacity-100 scale-100"
-                          leave="transition ease-in duration-75"
-                          leaveFrom="transform opacity-100 scale-100"
-                          leaveTo="transform opacity-0 scale-95"
-                        >
-                          <Listbox.Options className="bg-vsc-background max-h-80vh absolute z-50 mt-0.5 w-full overflow-y-scroll rounded-sm p-0">
-                            {profiles.map((option, idx) => (
-                              <Listbox.Option
-                                key={idx}
-                                value={option.id}
-                                className={`text-vsc-foreground hover:text-list-active-foreground flex cursor-pointer flex-row items-center gap-3 px-3 py-2 ${selectedProfile?.id === option.id ? "bg-list-active" : "bg-vsc-input-background"}`}
-                              >
-                                <AssistantIcon assistant={option} />
-                                <span className="lines lines-1 relative flex h-5 items-center justify-between gap-3 pr-2 text-xs">
-                                  {option.title}
-                                </span>
-                              </Listbox.Option>
-                            ))}
-                            {hubEnabled && (
-                              <Listbox.Option
-                                key={"no-profiles"}
-                                value={null}
-                                className={`text-vsc-foreground hover:bg-list-active bg-vsc-input-background flex cursor-pointer flex-row items-center gap-2 px-3 py-2`}
-                                onClick={() => {
-                                  if (session) {
-                                    ideMessenger.post("controlPlane/openUrl", {
-                                      path: "new",
-                                      orgSlug: selectedOrganization?.slug,
-                                    });
-                                  } else {
-                                    login(false);
-                                  }
-                                }}
-                              >
-                                <PlusCircleIcon className="h-4 w-4" />
-                                <span className="lines lines-1 flex items-center justify-between text-xs">
-                                  Create new Assistant
-                                </span>
-                              </Listbox.Option>
-                            )}
-                          </Listbox.Options>
-                        </Transition>
-
-                        {selectedProfile && (
-                          <div className="mt-3 flex w-full justify-center">
-                            <span
-                              className="text-lightgray flex cursor-pointer items-center gap-1 hover:underline"
-                              onClick={handleOpenConfig}
-                            >
-                              <ArrowTopRightOnSquareIcon className="h-4 w-4" />
-                              {hubEnabled
-                                ? "Open Assistant configuration"
-                                : "View Workspace"}
-                            </span>
-                          </div>
-                        )}
-                      </div>
-                    )}
-                  </Listbox>
-                </div>
-              </>
-            ) : (
-              <div>Loading...</div>
-            )}
-          </div>
-        </div>
+        <AccountManagement hubEnabled={hubEnabled} />
 
         {/* Model Roles as a separate section */}
         <div className="flex flex-col">