diff --git a/package-lock.json b/package-lock.json
index 545122e..d8c305c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3263,18 +3263,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/jiti": {
-      "version": "1.21.7",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
-      "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "bin": {
-        "jiti": "bin/jiti.js"
-      }
-    },
     "node_modules/js-yaml": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
@@ -4240,21 +4228,6 @@
         }
       }
     },
-    "node_modules/svelte-check/node_modules/picomatch": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
-      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/jonschlinkert"
-      }
-    },
     "node_modules/svelte-check/node_modules/readdirp": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
@@ -4825,21 +4798,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/yaml": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.1.tgz",
-      "integrity": "sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==",
-      "dev": true,
-      "license": "ISC",
-      "optional": true,
-      "peer": true,
-      "bin": {
-        "yaml": "bin.mjs"
-      },
-      "engines": {
-        "node": ">= 14.6"
-      }
-    },
     "node_modules/yargs": {
       "version": "17.7.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
diff --git a/src/lib/components/tree/ConfigTree.svelte b/src/lib/components/tree/ConfigTree.svelte
index e3c2536..24fc6c5 100644
--- a/src/lib/components/tree/ConfigTree.svelte
+++ b/src/lib/components/tree/ConfigTree.svelte
@@ -15,19 +15,16 @@
     compatible_config_types,
     selectClosestMatch,
   } from "./../../../routes/EditorLayout";
-  import { type Config } from "../../schemas";
+  import type { Config } from "../../schemas";
   import { Tree } from "./ConfigTree";
-  import { createEventDispatcher } from "svelte";
+  import { createEventDispatcher, tick } from "svelte";
   import { parentIframeCommunication } from "../../utils";
   import { dragTarget } from "../../actions/drag.action";
   import ProfileCloudTreeItem from "./ProfileCloudTreeItem.svelte";
-  import {
-    type AbstractFolderData,
-    AbstractTreeNode,
-    TreeItemType,
-    type ContextMenuOptions,
-    type TreeProperties,
-  } from "./TreeNode.svelte";
+  import { TreeItemType } from "./TreeNode.svelte";
+  import type { AbstractFolderData, AbstractTreeNode } from "./TreeNode.svelte";
+  import type { TreeProperties } from "./TreeComponent.svelte";
+  import type { ContextMenuOptions } from "@intechstudio/grid-uikit";
 
   import TreeFolder from "./TreeFolder.svelte";
 
@@ -36,8 +33,11 @@
   const dispatch = createEventDispatcher();
 
   export let configs: Config[];
+  export let scrollToSelectionTrigger = 0;
 
   let treeProps: TreeProperties;
+  let treeRoot: Tree.Node;
+  let filteredConfigs: Config[] = [];
 
   export function debounced<T>(store: Writable<T>, delay = 300) {
     let timeout: ReturnType<typeof setTimeout>;
@@ -56,7 +56,7 @@
   export const debounced_filter_value = debounced(filter_value, 300);
 
   $: {
-    treeProps = buildProps(
+    const tree = buildTree(
       configs,
       $debounced_filter_value,
       $sort_key,
@@ -64,6 +64,23 @@
       $hide_community_configs,
       $compatible_config_types,
     );
+    treeRoot = tree.root;
+    filteredConfigs = tree.filteredConfigs;
+  }
+
+  $: if (treeRoot) {
+    selectClosestMatch($selected_config, filteredConfigs);
+    const selected = get(selected_config);
+    treeProps = {
+      root: treeRoot,
+      selected: selected?.id,
+      expanded: treeRoot.getIncludingNodes(selected?.id),
+      scrollBehaviour: {
+        scrollToIndex: scrollToSelectionTrigger > 0,
+        scrollTrigger: scrollToSelectionTrigger,
+        easing: "smooth",
+      },
+    };
   }
 
   function filterNode(node: Tree.Node, filter: FilterValue, level = 0) {
@@ -112,14 +129,14 @@
     });
   }
 
-  function buildProps(
+  function buildTree(
     configs: Config[],
     filter: FilterValue,
     key: Sort.Key,
     supported: boolean,
     community: boolean,
     compatibileTypes: string[],
-  ): TreeProperties {
+  ) {
     const filteredConfigs = configs.filter((e) => matches(e, filter));
     const root = Tree.create(configs, {
       showSupportedOnly: supported,
@@ -129,14 +146,7 @@
 
     filterNode(root, filter);
 
-    selectClosestMatch($selected_config, filteredConfigs);
-
-    return {
-      root: root,
-      selected: $selected_config?.id,
-      expanded: root.getIncludingNodes($selected_config?.id),
-      scrollBehaviour: { scrollToIndex: true, easing: "instant" },
-    };
+    return { root, filteredConfigs };
   }
 
   function handleDeleteVirtualDirectory(title: string) {
diff --git a/src/lib/components/tree/ConfigTree.ts b/src/lib/components/tree/ConfigTree.ts
index a51b18e..f9e1d87 100644
--- a/src/lib/components/tree/ConfigTree.ts
+++ b/src/lib/components/tree/ConfigTree.ts
@@ -4,7 +4,7 @@ import {
   config_manager,
   compatible_config_types,
 } from "./../../../routes/EditorLayout";
-import { type Config } from "../../schemas";
+import type { Config } from "../../schemas";
 import { filter_value } from "../../../routes/Filter";
 import { Sort } from "../../../routes/Sorter";
 
@@ -22,6 +22,7 @@ import { ElementType, grid, ModuleType } from "@intechstudio/grid-protocol";
 export namespace Tree {
   export interface Options {
     showSupportedOnly?: boolean;
+    hideCommunityConfigs?: boolean;
     compatibileTypes: string[];
   }
 
@@ -287,7 +288,7 @@ export namespace Tree {
               e.owner ?? "",
             );
 
-          const cct = get(compatible_config_types);
+          const cct = get(compatible_config_types) as string[];
 
           return (
             !isMyConfig &&
@@ -311,7 +312,7 @@ export namespace Tree {
           const isOfficialConfig =
             configuration.WORKFLOW_CONFIG_PROFILE_IDS.includes(e.owner ?? "");
 
-          const cct = get(compatible_config_types);
+          const cct = get(compatible_config_types) as string[];
 
           return (
             !isMyConfig &&
@@ -336,7 +337,7 @@ export namespace Tree {
             configuration.RECOMMENDED_CONFIG_PROFILE_IDS.includes(
               e.owner ?? "",
             );
-          const cct = get(compatible_config_types);
+          const cct = get(compatible_config_types) as string[];
           return (
             !isMyConfig &&
             !isOfficialConfig &&
@@ -356,7 +357,7 @@ export namespace Tree {
         .filter((e: Config) => {
           const isMyConfig =
             e.syncStatus == "local" || e.owner === cm?.getCurrentOwnerId();
-          const cct = get(compatible_config_types);
+          const cct = get(compatible_config_types) as string[];
           return !isMyConfig && (!showSupportedOnly || cct.includes(e.type));
         })
         .map(
@@ -372,7 +373,7 @@ export namespace Tree {
         .filter((e: Config) => {
           const isMyConfig =
             e.syncStatus == "local" || e.owner === cm?.getCurrentOwnerId();
-          const cct = get(compatible_config_types);
+          const cct = get(compatible_config_types) as string[];
 
           return !isMyConfig && showSupportedOnly && !cct.includes(e.type);
         })
diff --git a/src/lib/components/tree/TreeComponent.svelte b/src/lib/components/tree/TreeComponent.svelte
index b786a79..d6a4bd9 100644
--- a/src/lib/components/tree/TreeComponent.svelte
+++ b/src/lib/components/tree/TreeComponent.svelte
@@ -2,6 +2,7 @@
   export interface TreeScrollBehaviour {
     scrollToIndex?: boolean;
     easing?: "smooth" | "instant";
+    scrollTrigger?: number;
   }
 
   export interface TreeProperties {
@@ -13,10 +14,12 @@
 </script>
 
 <script lang="ts">
-  import { createTreeView, type TreeView } from "@melt-ui/svelte";
-  import { setContext } from "svelte";
-  import TreeNode, { type AbstractTreeNode } from "./TreeNode.svelte";
-  import { type FolderSlotProps, type ItemSlotProps } from "./TreeChild.svelte";
+  import { createTreeView } from "@melt-ui/svelte";
+  import type { TreeView } from "@melt-ui/svelte";
+  import { setContext, tick } from "svelte";
+  import TreeNode from "./TreeNode.svelte";
+  import type { AbstractTreeNode } from "./TreeNode.svelte";
+  import type { FolderSlotProps, ItemSlotProps } from "./TreeChild.svelte";
   import { get } from "svelte/store";
 
   interface $$Slots {
@@ -33,7 +36,7 @@
   let rootHeight: number;
 
   let ctx: TreeView;
-  $: if ($root?.id) {
+  $: if ($root?.id && !ctx) {
     ctx = createTreeView({ onExpandedChange: handleExpandedChange });
     setContext("tree", ctx);
   }
@@ -63,10 +66,14 @@
   }
 
   let scrollTimeout: any;
-  async function scrollToNode(node: HTMLElement, id: string) {
+  let lastScrollTrigger: number | undefined;
+  async function scrollToNode(id: string, attempt = 0) {
     clearTimeout(scrollTimeout);
+    await tick();
     scrollTimeout = setTimeout(() => {
-      const target = node.querySelector(`#${CSS.escape(id)}`) as HTMLElement;
+      const target = rootElement?.querySelector(
+        `#${CSS.escape(id)}`,
+      ) as HTMLElement;
       if (target) {
         target.scrollIntoView({
           behavior: scrollBehaviour.easing ?? "smooth",
@@ -75,46 +82,48 @@
         });
         return;
       }
+
+      if (attempt < 4) {
+        scrollToNode(id, attempt + 1);
+      }
     }, 100);
   }
 
-  $: if (selected && (scrollBehaviour.scrollToIndex ?? false)) {
-    scrollToNode(rootElement, selected);
+  $: if (
+    selected &&
+    rootElement &&
+    (scrollBehaviour.scrollToIndex ?? false) &&
+    scrollBehaviour.scrollTrigger !== undefined &&
+    scrollBehaviour.scrollTrigger !== lastScrollTrigger
+  ) {
+    lastScrollTrigger = scrollBehaviour.scrollTrigger;
+    scrollToNode(selected);
   }
 </script>
 
-{#key tree}
-  <ul
-    bind:this={rootElement}
-    bind:clientHeight={rootHeight}
-    {...$tree}
-    class="tree"
-  >
-    <TreeNode node={root} level={0} {rootElement} {rootHeight}>
-      <svelte:fragment slot="folder" let:level let:item let:expanded>
-        <slot name="folder" {level} {item} {expanded} />
-      </svelte:fragment>
+<ul
+  bind:this={rootElement}
+  bind:clientHeight={rootHeight}
+  {...$tree}
+  class="tree"
+>
+  <TreeNode node={root} level={0} {rootElement} {rootHeight}>
+    <svelte:fragment slot="folder" let:level let:item let:expanded>
+      <slot name="folder" {level} {item} {expanded} />
+    </svelte:fragment>
 
-      <svelte:fragment
-        slot="item"
-        let:item
-        let:level
-        let:expanded
-        let:itemFunction
-        let:itemProps
-      >
-        <slot
-          name="item"
-          {level}
-          {item}
-          {expanded}
-          {itemFunction}
-          {itemProps}
-        />
-      </svelte:fragment>
-    </TreeNode>
-  </ul>
-{/key}
+    <svelte:fragment
+      slot="item"
+      let:item
+      let:level
+      let:expanded
+      let:itemFunction
+      let:itemProps
+    >
+      <slot name="item" {level} {item} {expanded} {itemFunction} {itemProps} />
+    </svelte:fragment>
+  </TreeNode>
+</ul>
 
 <style>
   ul {
diff --git a/src/lib/components/tree/TreeNode.svelte b/src/lib/components/tree/TreeNode.svelte
index 207bed1..3ce5fb6 100644
--- a/src/lib/components/tree/TreeNode.svelte
+++ b/src/lib/components/tree/TreeNode.svelte
@@ -173,7 +173,7 @@
   }
 
   $: {
-    const items = Array.from(listItems.values());
+    const items = Array.from(listItems.values()).filter(Boolean);
     if (items.length > 0 && level === 0) {
       setMaxHeight(rootHeight, items);
     }
diff --git a/src/lib/configmanager/ConfigManager.ts b/src/lib/configmanager/ConfigManager.ts
index 907e032..3e9dafb 100644
--- a/src/lib/configmanager/ConfigManager.ts
+++ b/src/lib/configmanager/ConfigManager.ts
@@ -6,12 +6,10 @@ import {
   where,
   onSnapshot,
   doc,
-  getDoc,
   deleteDoc,
   setDoc,
   updateDoc,
 } from "firebase/firestore";
-import { v4 as uuidv4 } from "uuid";
 import { configsCollection } from "../collections";
 import {
   type CloudConfig,
@@ -27,7 +25,7 @@ export interface ConfigManager {
   cancel(): void;
   deleteConfig(config: Config): Promise<void>;
   saveConfig(config: BaseConfig, createMissingConfigs: boolean): Promise<void>;
-  importLinkedConfig(linkId: string): Promise<CloudConfig | null | undefined>;
+  findLinkedConfigAppId(linkId: string): Promise<string | null | undefined>;
   changeCloudVisibility(config: Config, visibility: boolean): Promise<void>;
   getCurrentOwnerId(): string | null | undefined;
   getConfigCloudId(config: Config): string | undefined;
@@ -320,28 +318,8 @@ export function createConfigManager(observer: {
     );
   }
 
-  async function importLinkedConfig(linkId: string) {
-    const docRef = doc(configsCollection, linkId);
-    let configLink = await getDoc(docRef)
-      .then((res) => CloudConfigSchema.parse(res.data()))
-      .catch((err) => {
-        parentIframeCommunication({
-          windowPostMessageName: "sendLogMessage",
-          dataForParent: {
-            type: "fail",
-            message: "Error importing config link!",
-          },
-        });
-        return undefined;
-      });
-
-    if (configLink) {
-      configLink.name = `Copy of ${configLink.name}`;
-      configLink.owner = undefined;
-      configLink.id = uuidv4();
-      await saveConfig(configLink, true);
-    }
-    return configLink;
+  async function findLinkedConfigAppId(linkId: string) {
+    return configIdToAppConfigIdMap.get(linkId);
   }
 
   function getCurrentOwnerId() {
@@ -356,7 +334,7 @@ export function createConfigManager(observer: {
     cancel,
     deleteConfig,
     saveConfig,
-    importLinkedConfig,
+    findLinkedConfigAppId,
     changeCloudVisibility,
     getCurrentOwnerId,
     getConfigCloudId,
diff --git a/src/routes/EditorLayout.svelte b/src/routes/EditorLayout.svelte
index 9208e5c..c2ad17d 100644
--- a/src/routes/EditorLayout.svelte
+++ b/src/routes/EditorLayout.svelte
@@ -52,11 +52,14 @@
   import { last } from "@melt-ui/svelte/internal/helpers";
 
   let configs: Config[] = [];
+  let scrollToSelectedConfigTrigger = 0;
+  let pendingNewConfigScroll = false; // this helps new configs to scroll into view upon creation
 
   let linkFlag: string | undefined = undefined;
 
   let usernameInput = {
     element: null as HTMLInputElement | null,
+    value: null,
     exists: false,
     valid: false,
     active: false,
@@ -96,15 +99,62 @@
 
       case "configLink": {
         const cm = get(config_manager);
-        const linkedConfig = await cm?.importLinkedConfig(
+        const linkedConfigAppId = await cm?.findLinkedConfigAppId(
           event.data.configLinkId,
         );
 
-        if (linkedConfig) {
+        if (linkedConfigAppId) {
+          // Find the merged config from our configs list that matches the linked config ID
+          const matchedConfig = configs.find((c) => c.id === linkedConfigAppId);
+
+          if (matchedConfig) {
+            // Unhide groups that may be hiding the linked config
+            const currentOwnerId = cm?.getCurrentOwnerId();
+            const isMyConfig =
+              matchedConfig.syncStatus === "local" ||
+              matchedConfig.owner === currentOwnerId;
+
+            if (!isMyConfig) {
+              const isOfficialConfig =
+                configuration.RECOMMENDED_CONFIG_PROFILE_IDS.includes(
+                  matchedConfig.owner ?? "",
+                ) ||
+                configuration.WORKFLOW_CONFIG_PROFILE_IDS.includes(
+                  matchedConfig.owner ?? "",
+                );
+
+              // We can only know if config belongs to the community, if it's not official or the user's!
+              if (!isOfficialConfig && get(hide_community_configs)) {
+                hide_community_configs.set(false);
+              }
+
+              const cct = get(compatible_config_types) as string[];
+              if (
+                !cct.includes(matchedConfig.type) &&
+                get(show_supported_only)
+              ) {
+                show_supported_only.set(false);
+              }
+            }
+
+            // Select the config and notify the editor
+            selected_config.set(matchedConfig);
+            scrollToSelectedConfigTrigger += 1;
+            await provideSelectedConfigForEditor(matchedConfig);
+          }
+
           submitAnalytics({
             eventName: "Cloud Action",
             payload: {
-              click: "Config Link Import",
+              click: "Config Link Navigate",
+            },
+          });
+        } else {
+          parentIframeCommunication({
+            windowPostMessageName: "sendLogMessage",
+            dataForParent: {
+              type: "fail",
+              message: "Config not found or no longer available.",
             },
           });
         }
@@ -157,6 +207,7 @@
       const config = BaseConfigSchema.parse(configResponse.data);
       config.createdAt = new Date();
       const cm = get(config_manager);
+      pendingNewConfigScroll = true;
       cm?.saveConfig(config, true).then((e) => {
         filter_value.set(new FilterValue());
       });
@@ -225,9 +276,9 @@
 
   function selectLatestConfig() {
     if (configs.length == 0) return;
-
     configs.sort((a, b) => b.modifiedAt.getTime() - a.modifiedAt.getTime());
     selected_config.set(configs[0]);
+    scrollToSelectedConfigTrigger += 1; // trigger scrolling into view on ConfigTree
   }
 
   onMount(async () => {
@@ -239,7 +290,33 @@
             let bi = configs.findIndex((e) => e.id === b.id);
             return ai - bi;
           });
+
+          if (pendingNewConfigScroll) {
+            pendingNewConfigScroll = false;
+            const newEntry = newConfigs
+              .filter((c) => !configs.some((e) => e.id === c.id))
+              .sort(
+                (a, b) => b.modifiedAt.getTime() - a.modifiedAt.getTime(),
+              )[0];
+            if (newEntry) {
+              selected_config.set(newEntry);
+              scrollToSelectedConfigTrigger += 1;
+            }
+          }
+
           configs = newConfigs;
+
+          // Keep selected_config in sync with the latest config data.
+          // Without this, the store keeps a stale object after login (e.g. public: undefined).
+          const currentSelected = get(selected_config);
+          if (currentSelected) {
+            const refreshed = newConfigs.find(
+              (c) => c.id === currentSelected.id,
+            );
+            if (refreshed) {
+              selected_config.set(refreshed);
+            }
+          }
         },
       }),
     );
@@ -433,8 +510,13 @@
 
   $: handleSelectionChange($selected_config);
 
-  function handleSelectionChange(config) {
+  function handleSelectionChange(config: Config | undefined) {
     if (lastid === config?.id) {
+      // Same config — only update publicToggleValue if it was undefined before
+      // (handles the login case where public goes from undefined to a real value).
+      if (publicToggleValue === undefined && config?.public !== undefined) {
+        publicToggleValue = config?.public;
+      }
       return;
     }
 
@@ -446,7 +528,11 @@
     updateVisiblility(publicToggleValue);
   }
 
-  function updateVisiblility(value) {
+  function updateVisiblility(value: boolean | undefined) {
+    if (typeof value === "undefined") {
+      return;
+    }
+
     const config = configs.find((e) => e.id === $selected_config?.id);
     if (typeof config === "undefined") {
       return;
@@ -507,7 +593,10 @@
     <Splitpanes horizontal={true} theme="modern-theme" pushOtherPanes={false}>
       <Pane size={60}>
         <div class="tree-pane">
-          <ConfigTree {configs} />
+          <ConfigTree
+            {configs}
+            scrollToSelectionTrigger={scrollToSelectedConfigTrigger}
+          />
         </div></Pane
       >
       <Pane size={40}>
@@ -521,89 +610,99 @@
             data={$selected_config}
           >
             <svelte:fragment slot="link-button">
-              {@const config = $selected_config}
+              {@const config = configs.find(
+                (e) => e.id === $selected_config?.id,
+              )}
               {#if config?.syncStatus != "local"}
-                <button
-                  class="icon-button"
-                  on:click|stopPropagation={() => {
-                    handleLink();
-                  }}
-                  use:tooltip={{
-                    instant: true,
-                    text: "Link",
-                  }}
-                >
-                  <SvgIcon iconPath="link" fill="var(--foreground-muted)" />
-                  {#if linkFlag == config?.id}
-                    <div
-                      transition:fade|global={{
-                        duration: 100,
-                      }}
-                      class="popup"
-                    >
-                      Copied to clipboard!
-                    </div>
-                  {/if}
-                </button>
+                {#key config?.public}
+                  <button
+                    class="icon-button"
+                    disabled={!config?.public}
+                    on:click|stopPropagation={() => {
+                      handleLink();
+                    }}
+                    use:tooltip={{
+                      instant: true,
+                      text: config?.public
+                        ? "Link"
+                        : "Only public config can be linked",
+                    }}
+                  >
+                    <SvgIcon iconPath="link" fill="var(--foreground-muted)" />
+                    {#if linkFlag == config?.id}
+                      <div
+                        transition:fade|global={{
+                          duration: 100,
+                        }}
+                        class="popup"
+                      >
+                        Copied to clipboard!
+                      </div>
+                    {/if}
+                  </button>
+                {/key}
               {/if}
             </svelte:fragment>
             <svelte:fragment slot="sync-config-button">
               {@const config = configs.find(
                 (e) => e.id === $selected_config?.id,
               )}
-              {#if config?.syncStatus != "synced" || !config?.isEditable}
-                <button
-                  on:click|stopPropagation={async () => {
-                    if (typeof config === "undefined") {
-                      return;
-                    }
-
-                    if (
-                      config.isEditable &&
-                      config.syncStatus === "local" &&
-                      !$userAccountService.account
-                    ) {
-                      loginToProfileCloud();
-                      return;
-                    }
-                    let configToSave = config;
-                    if (!configToSave.isEditable) {
-                      configToSave = {
-                        ...configToSave,
-                        name: `Copy of ${configToSave.name}`,
-                        owner: undefined,
-                        id: "",
-                      };
-                    }
-                    const cm = get(config_manager);
-                    cm?.saveConfig(configToSave, true);
-                    provideSelectedConfigForEditor(undefined);
-                    submitAnalytics({
-                      eventName: "Cloud Action",
-                      payload: {
-                        click: "Sync config",
-                      },
-                    });
-                  }}
-                  class="icon-button"
-                  use:tooltip={{
-                    instant: true,
-                    text: !config?.isEditable
-                      ? "Import"
-                      : config.syncStatus === "cloud"
-                        ? "Download"
-                        : "Upload",
-                  }}
-                >
-                  <SvgIcon
-                    fill="var(--foreground-muted)"
-                    iconPath={!config?.isEditable
-                      ? "importIcon"
-                      : config.syncStatus === "cloud"
-                        ? "download"
-                        : "move_to_cloud_02"}
-                  />
-                </button>
+              {#if config?.syncStatus != "synced"}
+                {#key config?.id}
+                  <button
+                    on:click|stopPropagation={async () => {
+                      if (typeof config === "undefined") {
+                        return;
+                      }
+
+                      if (
+                        config.isEditable &&
+                        config.syncStatus === "local" &&
+                        !$userAccountService.account
+                      ) {
+                        loginToProfileCloud();
+                        return;
+                      }
+                      let configToSave = config;
+                      if (!configToSave.isEditable) {
+                        configToSave = {
+                          ...configToSave,
+                          name: `Copy of ${configToSave.name}`,
+                          owner: undefined,
+                          id: "",
+                        };
+                      }
+                      const cm = get(config_manager);
+                      pendingNewConfigScroll = true;
+                      cm?.saveConfig(configToSave, true);
+                      provideSelectedConfigForEditor(undefined);
+                      submitAnalytics({
+                        eventName: "Cloud Action",
+                        payload: {
+                          click: "Sync config",
+                        },
+                      });
+                    }}
+                    class="icon-button"
+                    use:tooltip={{
+                      instant: true,
+                      text: !config?.isEditable
+                        ? "Create a copy"
+                        : config.syncStatus === "cloud"
+                          ? "Download"
+                          : "Upload",
+                    }}
+                  >
+                    <SvgIcon
+                      fill="var(--foreground-muted)"
+                      iconPath={!config?.isEditable
+                        ? "importIcon"
+                        : config.syncStatus === "cloud"
+                          ? "download"
+                          : "move_to_cloud_02"}
+                    />
+                  </button>
+                {/key}
               {/if}
             </svelte:fragment>
             <svelte:fragment slot="import-config-browser-button">
@@ -725,6 +824,11 @@
     cursor: pointer;
   }
 
+  .icon-button:disabled {
+    opacity: 0.4;
+    cursor: default;
+  }
+
   div.popup {
     display: block;
     position: absolute;