feat(FR-1318): add button to start model service after cloning folder

[agatha197]

Resolves #4048 (FR-1318)

Summary

Adds a "Run This Model" button to the ModelCardModal that enables users to start model services immediately after cloning folders if no cloned folder exists. The implementation includes smart folder management, validation, and user confirmation workflows.

Changes

Core Implementation

• ModelTryContentButton: Enhanced component with folder cloning and service creation workflow
  • Removed modelCardMetadata dependency for cleaner
    interface
  • Added folder existence checking and validation logic
  • Implemented smart workflow: clone folder → validate
    files → create service
  • Added proper error handling and user confirmation
    dialogs

Key Features

• Smart Folder Management: Detects existing folders vs.
  new cloning needs
• File Validation: Checks for required
  service-definition.toml and model-definition.yaml files
• User Confirmation: Modal dialogs for cloning and
  using existing folders
• Background Tasks: Progress tracking with
  notifications for clone and service operations
• Error Handling: User-friendly error messages when
  files are missing or operations fail

UI Integration

• ModelCardModal: Re-enabled ModelTryContentButton in
  modal footer
• Internationalization: Added translation keys across
  all language files

Technical Details

The component now follows this workflow:

1. Check if similar named folder exists using GraphQL query
   with filters
2. If no folder exists → Confirm clone → Clone folder →
   Validate service definition → Create service
3. If folder exists → Confirm use existing → Validate
   service definition → Create service
4. Show progress notifications throughout the process

Test Plan

Endpoint: 10.82.230.49

• Verify "Run This Model" button appears in
  ModelCardModal
• Test cloning workflow when no similar folder exists
• Test using existing folder workflow
• Verify service-definition.toml validation
• Check error handling for missing files
• Confirm progress notifications work properly
• Test across different language localizations

[agatha197]

• feat(FR-1560): auto-dismiss running notification with timeout animation #4411
• feat(FR-1318): add button to start model service after cloning folder #4062 👈 (View in Graphite)
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• flow:merge-queue - adds this PR to the back of the merge queue
• flow:hotfix - for urgent hot fixes, skip the queue and merge this PR next

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has required the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[Copilot]

Pull Request Overview

This PR implements a button to start model services after cloning folders, introducing confirmation dialogs and validation for folder-based model service creation.

• Adds internationalization strings for clone confirmation and folder validation messages
• Implements folder definition file validation before service creation
• Modifies the model card modal to include the model service button

Reviewed Changes

Copilot reviewed 24 out of 24 changed files in this pull request and generated 2 comments.

File	Description
Multiple i18n files	Adds translation strings for folder clone confirmation dialogs and validation messages
ModelTryContentButton.tsx	Major refactoring to add folder validation, confirmation dialogs, and improved service creation flow
ModelCardModal.tsx	Re-enables the ModelTryContentButton in the modal footer
UserSettingsPage.tsx	Updates Antd API usage from bodyStyle to styles.body

Comments suppressed due to low confidence (1)

react/src/components/ModelTryContentButton.tsx:109

• The notification redirect URL uses data?.bgtask_id as the endpointId, but this should use the actual service endpoint ID from the service creation result. Background task ID and service endpoint ID are different values.

        method: 'GET',

[github-actions]

Coverage report for ./react

St.❔	Category	Percentage	Covered / Total
🔴	Statements	4.68% (-0.01% 🔻)	532/11360
🔴	Branches	3.78% (-0.01% 🔻)	302/7997
🔴	Functions	2.9% (+0% 🔼)	102/3517
🔴	Lines	4.63% (-0.01% 🔻)	514/11101

Test suite run success

121 tests passing in 14 suites.

Report generated by 🧪jest coverage report action from 58ed4db

[github-actions]

Coverage report for ./packages/backend.ai-ui

St.❔	Category	Percentage	Covered / Total
🔴	Statements	51.18% (-1.93% 🔻)	130/254
🔴	Branches	32.79% (-0.41% 🔻)	80/244
🔴	Functions	34.48% (-1.23% 🔻)	20/58
🔴	Lines	53.36% (-2.04% 🔻)	119/223

Show files with reduced coverage 🔻

St.❔	File	Statements	Branches	Functions	Lines
🟡	helper/index.ts	66.17% (-5.5% 🔻)	46.98% (-0.97% 🔻)	61.54% (-5.13% 🔻)	70% (-6% 🔻)

Test suite run success

55 tests passing in 3 suites.

Report generated by 🧪jest coverage report action from 2e63cf8

[nowgnuesLee]

LGTM

[ironAiken2]

The payload is coming in with undefined image information.

[agatha197]

@ironAiken2 It is intended. The image will be set by service-definition.yaml

https://app.graphite.dev/github/pr/lablup/backend.ai-webui/4062/feat(FR-1318)-add-button-to-start-model-service-after-cloning-folder#discussion-IC_kwDOCRTcws7BXOcQ

[yomybaby]

Please check my reviews

[yomybaby]

Please check this review again.
https://app.graphite.dev/github/pr/lablup/backend.ai-webui/4062/feat(FR-1318)-add-button-to-start-model-service-after-cloning-folder#comment-PRRC_kwDOCRTcws6LX8tk

And resolve conflict ;)

[yomybaby]

There is an issue where the service creation request keeps retrying indefinitely when the service creation fails.

iShot_2025-10-01_11.30.52.mp4 (uploaded via Graphite)