mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-08 09:00:05 +00:00
8d4a6df7f8
## Summary Adds a dedicated upgrade modal that appears when users without private models access try to upload models, providing a clear path to upgrade their subscription. ## Changes - **New upgrade modal**: Created `UploadModelUpgradeModal` with dedicated body, header, and footer components - **Conditional rendering**: Modified `AssetBrowserModal` to show upgrade modal when `privateModelsEnabled` flag is false - **Subscription integration**: Connected upgrade flow to existing subscription system via `showSubscriptionDialog()` - **Localization**: Added localization keys for upgrade messaging ## Review Focus - Conditional logic in `AssetBrowserModal.handleUploadClick()` based on feature flags - Component naming consistency (all upgrade-related components prefixed with `UploadModelUpgrade`) - Footer component refactoring maintains existing upload wizard behavior 🤖 Generated with [Claude Code](https://claude.com/claude-code) ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7124-feat-add-upgrade-modal-for-model-upload-when-private-models-disabled-2be6d73d36508147b72eea8a1d6ab772) by [Unito](https://www.unito.io) --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Alexander Brown <drjkl@comfy.org>
31 lines
928 B
Vue
31 lines
928 B
Vue
<template>
|
|
<div
|
|
class="flex flex-col justify-between gap-10 p-4 border-t border-border-default w-auto max-w-[min(500px,90vw)]"
|
|
>
|
|
<UploadModelUpgradeModalBody />
|
|
|
|
<UploadModelUpgradeModalFooter
|
|
@close="handleClose"
|
|
@subscribe="handleSubscribe"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import UploadModelUpgradeModalBody from '@/platform/assets/components/UploadModelUpgradeModalBody.vue'
|
|
import UploadModelUpgradeModalFooter from '@/platform/assets/components/UploadModelUpgradeModalFooter.vue'
|
|
import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
|
|
import { useDialogStore } from '@/stores/dialogStore'
|
|
|
|
const dialogStore = useDialogStore()
|
|
const { showSubscriptionDialog } = useSubscription()
|
|
|
|
function handleClose() {
|
|
dialogStore.closeDialog({ key: 'upload-model-upgrade' })
|
|
}
|
|
|
|
function handleSubscribe() {
|
|
showSubscriptionDialog()
|
|
}
|
|
</script>
|