mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-29 18:52:19 +00:00
## Summary Backport of #6794 to cloud/1.32 - Re-enables share button in Linear Mode (exports workflow) - Displays Assets Panel in left sidebar instead of Queue Panel - Adds margin to main content area ## Conflict Resolution Resolved conflict in `src/views/LinearView.vue`: - Replaced `useQueueSidebarTab` → `useAssetsSidebarTab` (the intended change from the original PR) ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6935-backport-Share-button-and-Assets-Panel-in-Linear-Mode-6794-2b66d73d36508116a759e9a5c585315a) by [Unito](https://www.unito.io) Co-authored-by: AustinMroz <austin@comfy.org>
This commit is contained in:
@@ -2197,6 +2197,10 @@
|
|||||||
"vueNodesMigrationMainMenu": {
|
"vueNodesMigrationMainMenu": {
|
||||||
"message": "Switch back to Nodes 2.0 anytime from the main menu."
|
"message": "Switch back to Nodes 2.0 anytime from the main menu."
|
||||||
},
|
},
|
||||||
|
"linearMode": {
|
||||||
|
"share": "Share",
|
||||||
|
"openWorkflow": "Open Workflow"
|
||||||
|
},
|
||||||
"missingNodes": {
|
"missingNodes": {
|
||||||
"cloud": {
|
"cloud": {
|
||||||
"title": "These nodes aren't available on Comfy Cloud yet",
|
"title": "These nodes aren't available on Comfy Cloud yet",
|
||||||
|
|||||||
@@ -15,21 +15,20 @@ import {
|
|||||||
isValidWidgetValue,
|
isValidWidgetValue,
|
||||||
safeWidgetMapper
|
safeWidgetMapper
|
||||||
} from '@/composables/graph/useGraphNodeManager'
|
} from '@/composables/graph/useGraphNodeManager'
|
||||||
import { useQueueSidebarTab } from '@/composables/sidebarTabs/useQueueSidebarTab'
|
import { useAssetsSidebarTab } from '@/composables/sidebarTabs/useAssetsSidebarTab'
|
||||||
import { t } from '@/i18n'
|
import { t } from '@/i18n'
|
||||||
import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
|
import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
|
||||||
import { useTelemetry } from '@/platform/telemetry'
|
import { useTelemetry } from '@/platform/telemetry'
|
||||||
|
import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
|
||||||
import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
|
import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
|
||||||
import NodeWidgets from '@/renderer/extensions/vueNodes/components/NodeWidgets.vue'
|
import NodeWidgets from '@/renderer/extensions/vueNodes/components/NodeWidgets.vue'
|
||||||
import WidgetInputNumberInput from '@/renderer/extensions/vueNodes/widgets/components/WidgetInputNumber.vue'
|
import WidgetInputNumberInput from '@/renderer/extensions/vueNodes/widgets/components/WidgetInputNumber.vue'
|
||||||
import { app } from '@/scripts/app'
|
import { app } from '@/scripts/app'
|
||||||
import { useCommandStore } from '@/stores/commandStore'
|
import { useCommandStore } from '@/stores/commandStore'
|
||||||
import { useNodeOutputStore } from '@/stores/imagePreviewStore'
|
import { useNodeOutputStore } from '@/stores/imagePreviewStore'
|
||||||
//import { useQueueStore } from '@/stores/queueStore'
|
|
||||||
import { useQueueSettingsStore } from '@/stores/queueStore'
|
import { useQueueSettingsStore } from '@/stores/queueStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
import { isElectron } from '@/utils/envUtil'
|
||||||
|
|
||||||
//const queueStore = useQueueStore()
|
|
||||||
const nodeOutputStore = useNodeOutputStore()
|
const nodeOutputStore = useNodeOutputStore()
|
||||||
const commandStore = useCommandStore()
|
const commandStore = useCommandStore()
|
||||||
const nodeDatas = computed(() => {
|
const nodeDatas = computed(() => {
|
||||||
@@ -120,12 +119,12 @@ function openFeedback() {
|
|||||||
<div
|
<div
|
||||||
class="sidebar-content-container h-full w-full overflow-x-hidden overflow-y-auto border-r-1 border-node-component-border"
|
class="sidebar-content-container h-full w-full overflow-x-hidden overflow-y-auto border-r-1 border-node-component-border"
|
||||||
>
|
>
|
||||||
<ExtensionSlot :extension="useQueueSidebarTab()" />
|
<ExtensionSlot :extension="useAssetsSidebarTab()" />
|
||||||
</div>
|
</div>
|
||||||
</SplitterPanel>
|
</SplitterPanel>
|
||||||
<SplitterPanel
|
<SplitterPanel
|
||||||
:size="98"
|
:size="98"
|
||||||
class="flex flex-row overflow-y-auto flex-wrap min-w-min gap-4"
|
class="flex flex-row overflow-y-auto flex-wrap min-w-min gap-4 m-4"
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
v-for="previewUrl in nodeOutputStore.latestOutput"
|
v-for="previewUrl in nodeOutputStore.latestOutput"
|
||||||
@@ -141,18 +140,26 @@ function openFeedback() {
|
|||||||
</SplitterPanel>
|
</SplitterPanel>
|
||||||
<SplitterPanel :size="1" class="flex flex-col gap-1 p-1 min-w-min">
|
<SplitterPanel :size="1" class="flex flex-col gap-1 p-1 min-w-min">
|
||||||
<div
|
<div
|
||||||
class="actionbar-container flex h-12 items-center rounded-lg border border-[var(--interface-stroke)] p-2 gap-2 bg-comfy-menu-bg justify-center"
|
class="actionbar-container flex h-12 items-center rounded-lg border border-[var(--interface-stroke)] p-2 gap-2 bg-comfy-menu-bg justify-end"
|
||||||
>
|
>
|
||||||
<Button label="Feedback" severity="secondary" @click="openFeedback" />
|
|
||||||
<Button
|
<Button
|
||||||
label="Open Workflow"
|
:label="t('g.feedback')"
|
||||||
|
severity="secondary"
|
||||||
|
@click="openFeedback"
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
:label="t('linearMode.openWorkflow')"
|
||||||
severity="secondary"
|
severity="secondary"
|
||||||
class="min-w-max"
|
class="min-w-max"
|
||||||
icon="icon-[comfy--workflow]"
|
icon="icon-[comfy--workflow]"
|
||||||
icon-pos="right"
|
icon-pos="right"
|
||||||
@click="useCanvasStore().linearMode = false"
|
@click="useCanvasStore().linearMode = false"
|
||||||
/>
|
/>
|
||||||
<!--<Button label="Share" severity="contrast" /> Temporarily disabled-->
|
<Button
|
||||||
|
:label="t('linearMode.share')"
|
||||||
|
severity="contrast"
|
||||||
|
@click="useWorkflowService().exportWorkflow('workflow', 'workflow')"
|
||||||
|
/>
|
||||||
<CurrentUserButton v-if="isLoggedIn" />
|
<CurrentUserButton v-if="isLoggedIn" />
|
||||||
<LoginButton v-else-if="isDesktop" />
|
<LoginButton v-else-if="isDesktop" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user