[feat] Rename license filter to 'Runs On' filter in template selector (#6543)

## Summary

Renamed the templates license filter to better reflect its actual
purpose - showing where a template executes (locally in ComfyUI vs
external/remote API).

The current "License" filter has been causing confusion with model
licensing terms (e.g., Apache vs flux-dev licensing). This PR clarifies
the filter's purpose by renaming it to "Runs On" and updating the
options to be more descriptive of inference location.

<img width="196" height="230" alt="image"
src="https://github.com/user-attachments/assets/8cbea263-f399-4945-82c1-357ec185f5a7"
/>

<img width="861" height="597" alt="image"
src="https://github.com/user-attachments/assets/af116876-d7a5-49c5-b791-1fda637ff3a3"
/>


## Changes

- **Filter name**: "License" → "Runs On"
- **Filter options**: 
  - "Open Source" → "ComfyUI"
  - "Closed Source (API Nodes)" → "External or Remote API"
- **Icon**: Changed from `file-text` to `server` for better visual
representation
- **Variable naming**: Updated all related variables, types, and tests
to use `runsOn` naming convention
- **Telemetry**: Updated metadata to track `selected_runs_on` instead of
`selected_licenses`

## Why "Runs On"?

- **Clear intent**: Users want to know if a template runs locally or
requires an API call
- **Avoids confusion**: Separates the concept from model licensing terms
- **Inclusive wording**: "Remote" is included alongside "API" to help
users who may not be familiar with API terminology
- **Cloud-agnostic**: "Runs On" works whether the app itself is running
locally or in the cloud

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6543-feat-Rename-license-filter-to-Runs-On-filter-in-template-selector-29f6d73d3650811f935bc1f3fce7d7ad)
by [Unito](https://www.unito.io)
This commit is contained in:
Christian Byrne
2025-11-02 16:35:42 -08:00
committed by GitHub
parent 8dfdac3fc4
commit 8df0a3885d
5 changed files with 49 additions and 52 deletions

View File

@@ -68,17 +68,17 @@
</template>
</MultiSelect>
<!-- License Filter -->
<!-- Runs On Filter -->
<MultiSelect
v-model="selectedLicenseObjects"
:label="licenseFilterLabel"
:options="licenseOptions"
v-model="selectedRunsOnObjects"
:label="runsOnFilterLabel"
:options="runsOnOptions"
:show-search-box="true"
:show-selected-count="true"
:show-clear-button="true"
>
<template #icon>
<i class="icon-[lucide--file-text]" />
<i class="icon-[lucide--server]" />
</template>
</MultiSelect>
</div>
@@ -528,12 +528,12 @@ const {
searchQuery,
selectedModels,
selectedUseCases,
selectedLicenses,
selectedRunsOn,
sortBy,
filteredTemplates,
availableModels,
availableUseCases,
availableLicenses,
availableRunsOn,
filteredCount,
totalCount,
resetFilters
@@ -561,15 +561,15 @@ const selectedUseCaseObjects = computed({
}
})
const selectedLicenseObjects = computed({
const selectedRunsOnObjects = computed({
get() {
return selectedLicenses.value.map((license) => ({
name: license,
value: license
return selectedRunsOn.value.map((runsOn) => ({
name: runsOn,
value: runsOn
}))
},
set(value: { name: string; value: string }[]) {
selectedLicenses.value = value.map((item) => item.value)
selectedRunsOn.value = value.map((item) => item.value)
}
})
@@ -602,10 +602,10 @@ const useCaseOptions = computed(() =>
}))
)
const licenseOptions = computed(() =>
availableLicenses.value.map((license) => ({
name: license,
value: license
const runsOnOptions = computed(() =>
availableRunsOn.value.map((runsOn) => ({
name: runsOn,
value: runsOn
}))
)
@@ -634,14 +634,14 @@ const useCaseFilterLabel = computed(() => {
}
})
const licenseFilterLabel = computed(() => {
if (selectedLicenseObjects.value.length === 0) {
return t('templateWorkflows.licenseFilter', 'License')
} else if (selectedLicenseObjects.value.length === 1) {
return selectedLicenseObjects.value[0].name
const runsOnFilterLabel = computed(() => {
if (selectedRunsOnObjects.value.length === 0) {
return t('templateWorkflows.runsOnFilter', 'Runs On')
} else if (selectedRunsOnObjects.value.length === 1) {
return selectedRunsOnObjects.value[0].name
} else {
return t('templateWorkflows.licensesSelected', {
count: selectedLicenseObjects.value.length
return t('templateWorkflows.runsOnSelected', {
count: selectedRunsOnObjects.value.length
})
}
})
@@ -708,7 +708,7 @@ watch(
sortBy,
selectedModels,
selectedUseCases,
selectedLicenses
selectedRunsOn
],
() => {
resetPagination()