mirror of
https://github.com/modrinth/code.git
synced 2026-08-27 10:04:52 +00:00
feat: content tab rewrite for worlds (#5136)
* feat: base content card component * fix: tooltips + colors * feat: fix orgs * feat: base content tab internals rewrite * feat: fix invalidmodal * feat: add ContentModpackCard * fix: extract types * draft: layout * feat: unlink modal * feat: impl content tab * fix: lint * fix: toggling * temp: disable updating stuff * feat: selection v-model * feat: bulk selection * feat: mods tab rough draft * feat: use fuse.js * feat: add project combobox * clean up project combobox * feat: start install to play modal * fix: events * feat: use v-on * feat: bulk actions + fix floating action bar width * feat: figma alignments * feat: migrate toggle to tailwind * fix: row borders * feat: disabled state * feat: virtual list impl for card table based on window scroll * fix: lint * feat: virtualization + smaller contentcard items * feat: use ContentCardTable + ContentCardItems * feat: fix gap + border issues on last elm * feat: cleanup + use proper searching * fix: use TeleportOverflowMenu * fix: fallback to svg if src is invalid on avatar component * fix: storybook * feat: start on updater modal * feat: finish content updater modal * feat: i18n pass * feat: impl modal * feat(app): backend changes for content tab refactor (#5237) * feat: include_changelog=false for updater modal * fix: hash overrides * feat: update checking for modpack * feat: qa * feat: modpack content modal * fix: padding in table to match modals + tightness * fix: lint * feat: delete modal * feat: fix toggle bugs * fix: prepr * fix: duplicate messages * qa: full width search * qa: use bg-surface-1.5 * qa: animation for filter pills * qa: standardize hover colors * fix: border-[1px] is border * qa: mass de-select actually mass selecting * qa: match figma designs for floating action bar * qa: modal fixes * q: modal fixes x2 * fix: table border * qa: confirm modals * qa: modal alignment * qa: re-add stuck heading + dedupe logic * qa: dedupe virtual scrolling + remove dead components * qa: responsiveness for content table + link fixes * qa: version column link, tooltips + lint fixes * qa: instance busy protections * fix: installation freeze bug * chore: remove old mods page * refactor: deduplicate layout * chore: delete old content page(s) * qa * qa * qa * feat: sort btn - to iterate * fix: ml * feat: date added * fix: lint * fix: formatting.ts removal * feat: get_dependencies_as_content_items * qa: final QA changes * refactor: deduplicate + polish content.rs * feat: hook up content.vue with v1 * feat: hide v1 content api behind frontend feature flag * fix: query keys + copy on empty state * chore: i18n pass * feat: reimpl unlink + upload endpoint * feat: use bulk endpoints v1 * fix: lint * fix: flags * fix: responsiveness via container queries * fix: lint * qa: 1 * qa: fixes * qa: fix ssr issues with browse content * qa: header page divider * qa: modals * fix: prepr * fix: issues * fix: lint * fix: toggle v1 ff * qa: 5 * qa: delete modal copy * feat: creation flow modals (#5383) * refactor: delete content v0 usages + impl * feat: qa + fixes * feat: installing banner using state event * feat: fix modpack card bugs + filtering issues * refactor: delete backups v0 api module * feat: v1 servers GET endpoint * fix: backups * feat: swap to kyros upload v1 addon * fix: use tanstack for loader.vue * feat: finish install from discovery modal * qa: bug fixes * feat: set up installation settings * fix: lint * fix: typos * fix: bugs * fix: disable inline content * feat: content tab improvements — upload UX, installation settings, and client-only indicators Upload cancellation and navigation guard: - Add ConfirmLeaveModal that prompts when navigating away during upload - Cancel in-flight XHR uploads when user confirms leaving the page - Add beforeunload handler to warn on browser/tab close during upload - Track uploadedBytes/totalBytes in UploadState for progress display - Replace Collapsible with Transition for upload progress admonition - Show byte progress and percentage in upload banner - Clamp upload progress to prevent exceeding 100% Installation settings (server.properties): - Add KnownPropertiesFields and PropertiesFields types to Archon types - Add buildProperties() to creation flow context to collect gamemode, difficulty, seed, world type, structures, and generator settings - Pass properties through installContent on onboarding, discovery, and ServerSetupModal flows Server setup and discovery flow improvements: - Migrate ServerSetupModal from servers_v0.reinstall to content_v1.installContent - Replace loaderApiNames lookup with toApiLoader() helper - Remove eraseDataOnInstall toggle — always use soft_override: false - Simplify modpack install on discovery page to use first available version and route through creation flow modal for both onboarding and non-onboarding - Differentiate post-install navigation: content page for onboarding, loader options for existing servers Modpack update flow: - Replace updateModpack() call with installContent() using soft_override: true to support version selection in the content updater modal Client-only mod indicators: - Add environment field to AddonVersion (reuses Labrinth.Projects.v3.Environment) - Add environment to ContentItem and isClientOnly to ContentCardTableItem - Show orange TriangleAlertIcon with tooltip on client-only mods in content table - Add "Client-only" filter pill to content filtering (controlled via showClientOnlyFilter on ContentManagerContext) - Apply client-only indicators in both ContentPageLayout and ModpackContentModal Misc: - Add CLAUDE.md note about using prepr commands for lint checks - Export ConfirmLeaveModal from instances barrel * fix: piping * fix: switch content disable for linked server instances * feat: client only filter * fix: prepr * feat: hasUpdate shape update * feat: bulk update endpoint impl for content in panel * feat: websocket state impl again with new phases * fix: ws * fix: use timeout fn for sync admon + fix content card layout scroll for browsers with overflow anchor bug * fix: qa bugs * fix: lint, a11y and i18n * refactor: set up layouts folder properly * fix: linked data cache stuff + lint * feat: move installationsettings to shared layout * fix: lint * fix: issues * feat: temp fuck staging up * fix: lockfile * fix: data sync issues on loader.vue * fix: lint * Hide shader configuration files from content list (#5499) * feat: workaround search problem + split out reset * fix: qa * fix: changelog not showing on first open * fix: qa + optimistic updating improvements * fix: prepr+lint * fix: qa * feat: qa * fix: lint * fix: lint * fix: build * fix: build * fix: type errors * fix: fade and JAVA_HOME passthrough * feat: qa * feat: impl diff shit * fix: qa * fix: app qa * feat: update diff modal * fix: endpoint * fix: qa * fix: qa * fix: use bulk in modpack modal * feat: abort signal impl + fix issues * fix: diff modal trunc * feat: qa * fix: qa * feat: tooltip content tab * fix: prepr * fix: dismiss on settings btn * feat: qa * feat: dont clear handlers on disconnect * fix: lint * fix: wrangler + introduce staging-archon env file --------- Signed-off-by: Calum H. <calum@modrinth.com> Co-authored-by: tdgao <mr.trumgao@gmail.com> Co-authored-by: Artyom Ezri <61311568+Artezon@users.noreply.github.com>
This commit is contained in:
co-authored by
tdgao
Artyom Ezri
parent
f0224dfff7
commit
7d92e4ec7f
@@ -0,0 +1,396 @@
|
||||
import type { Archon } from '@modrinth/api-client'
|
||||
import { computed, type ComputedRef, type Ref, ref, type ShallowRef, watch } from 'vue'
|
||||
import type { ComponentExposed } from 'vue-component-type-helpers'
|
||||
|
||||
import { useDebugLogger } from '#ui/composables/debug-logger'
|
||||
|
||||
import { createContext } from '../../../providers'
|
||||
import type { ImportableLauncher } from '../../../providers/instance-import'
|
||||
import type { MultiStageModal, StageConfigInput } from '../../base'
|
||||
import type { ComboboxOption } from '../../base/Combobox.vue'
|
||||
import { stageConfigs } from './stages'
|
||||
|
||||
export type FlowType = 'world' | 'server-onboarding' | 'reset-server' | 'instance'
|
||||
export type SetupType = 'modpack' | 'custom' | 'vanilla'
|
||||
export type Gamemode = 'survival' | 'creative' | 'hardcore'
|
||||
export type Difficulty = 'peaceful' | 'easy' | 'normal' | 'hard'
|
||||
export type LoaderVersionType = 'stable' | 'latest' | 'other'
|
||||
export type GeneratorSettingsMode = 'default' | 'flat' | 'custom'
|
||||
|
||||
export interface ModpackSelection {
|
||||
projectId: string
|
||||
versionId: string
|
||||
name: string
|
||||
iconUrl?: string
|
||||
}
|
||||
|
||||
export interface ModpackSearchHit {
|
||||
title: string
|
||||
iconUrl?: string
|
||||
latestVersion?: string
|
||||
}
|
||||
|
||||
export interface ModpackSearchResult {
|
||||
hits: {
|
||||
project_id: string
|
||||
title: string
|
||||
icon_url: string
|
||||
latest_version?: string
|
||||
}[]
|
||||
total_hits: number
|
||||
offset: number
|
||||
limit: number
|
||||
}
|
||||
|
||||
export const flowTypeHeadings: Record<FlowType, string> = {
|
||||
world: 'Create world',
|
||||
'server-onboarding': 'Set up server',
|
||||
'reset-server': 'Reset server',
|
||||
instance: 'Create instance',
|
||||
}
|
||||
|
||||
export interface CreationFlowContextValue {
|
||||
// Flow
|
||||
flowType: FlowType
|
||||
|
||||
// Configuration
|
||||
availableLoaders: string[]
|
||||
showSnapshotToggle: boolean
|
||||
disableClose: boolean
|
||||
isInitialSetup: boolean
|
||||
|
||||
// Initial values
|
||||
initialLoader: string | null
|
||||
initialGameVersion: string | null
|
||||
|
||||
// State
|
||||
setupType: Ref<SetupType | null>
|
||||
isImportMode: Ref<boolean>
|
||||
worldName: Ref<string>
|
||||
gamemode: Ref<Gamemode>
|
||||
difficulty: Ref<Difficulty>
|
||||
worldSeed: Ref<string>
|
||||
worldTypeOption: Ref<string>
|
||||
generateStructures: Ref<boolean>
|
||||
generatorSettingsMode: Ref<GeneratorSettingsMode>
|
||||
generatorSettingsCustom: Ref<string>
|
||||
|
||||
// Instance-specific state
|
||||
instanceName: Ref<string>
|
||||
instanceIcon: Ref<File | null>
|
||||
instanceIconUrl: Ref<string | null>
|
||||
instanceIconPath: Ref<string | null>
|
||||
|
||||
// Loader/version state (custom setup)
|
||||
selectedLoader: Ref<string | null>
|
||||
selectedGameVersion: Ref<string | null>
|
||||
loaderVersionType: Ref<LoaderVersionType>
|
||||
selectedLoaderVersion: Ref<string | null>
|
||||
hideLoaderChips: ComputedRef<boolean>
|
||||
hideLoaderVersion: ComputedRef<boolean>
|
||||
showSnapshots: Ref<boolean>
|
||||
|
||||
// Modpack state
|
||||
modpackSelection: Ref<ModpackSelection | null>
|
||||
modpackFile: Ref<File | null>
|
||||
modpackFilePath: Ref<string | null>
|
||||
|
||||
// Modpack search state (persisted across stage navigation)
|
||||
modpackSearchProjectId: Ref<string | undefined>
|
||||
modpackSearchVersionId: Ref<string | undefined>
|
||||
modpackSearchOptions: Ref<ComboboxOption<string>[]>
|
||||
modpackVersionOptions: Ref<ComboboxOption<string>[]>
|
||||
modpackSearchHits: Ref<Record<string, ModpackSearchHit>>
|
||||
|
||||
// Import state (instance flow only)
|
||||
importLaunchers: Ref<ImportableLauncher[]>
|
||||
importSelectedInstances: Ref<Record<string, Set<string>>>
|
||||
importSearchQuery: Ref<string>
|
||||
|
||||
// Confirm stage
|
||||
hardReset: Ref<boolean>
|
||||
|
||||
// Loading state (set when finish() is called, cleared on reset)
|
||||
loading: Ref<boolean>
|
||||
|
||||
// Modal
|
||||
modal: ShallowRef<ComponentExposed<typeof MultiStageModal> | null>
|
||||
stageConfigs: StageConfigInput<CreationFlowContextValue>[]
|
||||
|
||||
// Callbacks
|
||||
onBack: (() => void) | null
|
||||
|
||||
// Methods
|
||||
reset: (instanceCount?: number) => void
|
||||
setSetupType: (type: SetupType) => void
|
||||
setImportMode: () => void
|
||||
browseModpacks: () => void
|
||||
finish: () => void
|
||||
buildProperties: () => Archon.Content.v1.PropertiesFields
|
||||
|
||||
// Platform-provided search
|
||||
searchModpacks: (query: string, limit?: number) => Promise<ModpackSearchResult>
|
||||
getProjectVersions: (projectId: string) => Promise<{ id: string }[]>
|
||||
}
|
||||
|
||||
export const [injectCreationFlowContext, provideCreationFlowContext] =
|
||||
createContext<CreationFlowContextValue>('CreationFlowModal')
|
||||
|
||||
// TODO: replace with actual world count from the world list once available
|
||||
let worldCounter = 0
|
||||
let instanceCounter = 0
|
||||
|
||||
export interface CreationFlowOptions {
|
||||
availableLoaders?: string[]
|
||||
showSnapshotToggle?: boolean
|
||||
disableClose?: boolean
|
||||
isInitialSetup?: boolean
|
||||
initialLoader?: string
|
||||
initialGameVersion?: string
|
||||
onBack?: () => void
|
||||
searchModpacks?: (query: string, limit?: number) => Promise<ModpackSearchResult>
|
||||
getProjectVersions?: (projectId: string) => Promise<{ id: string }[]>
|
||||
}
|
||||
|
||||
export function createCreationFlowContext(
|
||||
modal: ShallowRef<ComponentExposed<typeof MultiStageModal> | null>,
|
||||
flowType: FlowType,
|
||||
emit: {
|
||||
browseModpacks: () => void
|
||||
create: (config: CreationFlowContextValue) => void
|
||||
},
|
||||
options: CreationFlowOptions = {},
|
||||
): CreationFlowContextValue {
|
||||
const debug = useDebugLogger('CreationFlow')
|
||||
const availableLoaders = options.availableLoaders ?? ['fabric', 'neoforge', 'forge', 'quilt']
|
||||
const showSnapshotToggle = options.showSnapshotToggle ?? false
|
||||
const disableClose = options.disableClose ?? false
|
||||
const isInitialSetup = options.isInitialSetup ?? false
|
||||
const initialLoader = options.initialLoader ?? null
|
||||
const initialGameVersion = options.initialGameVersion ?? null
|
||||
const onBack = options.onBack ?? null
|
||||
|
||||
const setupType = ref<SetupType | null>(null)
|
||||
const isImportMode = ref(false)
|
||||
const worldName = ref('')
|
||||
const gamemode = ref<Gamemode>('survival')
|
||||
const difficulty = ref<Difficulty>('normal')
|
||||
const worldSeed = ref('')
|
||||
const worldTypeOption = ref('minecraft:normal')
|
||||
const generateStructures = ref(true)
|
||||
const generatorSettingsMode = ref<GeneratorSettingsMode>('default')
|
||||
const generatorSettingsCustom = ref('')
|
||||
|
||||
// Instance-specific state
|
||||
const instanceName = ref('')
|
||||
const instanceIcon = ref<File | null>(null)
|
||||
const instanceIconUrl = ref<string | null>(null)
|
||||
const instanceIconPath = ref<string | null>(null)
|
||||
|
||||
// Revoke old object URL when icon is cleared to avoid memory leaks
|
||||
watch(instanceIconUrl, (_newUrl, oldUrl) => {
|
||||
if (oldUrl && oldUrl.startsWith('blob:')) {
|
||||
URL.revokeObjectURL(oldUrl)
|
||||
}
|
||||
})
|
||||
|
||||
const selectedLoader = ref<string | null>(null)
|
||||
const selectedGameVersion = ref<string | null>(null)
|
||||
const loaderVersionType = ref<LoaderVersionType>('stable')
|
||||
const selectedLoaderVersion = ref<string | null>(null)
|
||||
const showSnapshots = ref(false)
|
||||
|
||||
const modpackSelection = ref<ModpackSelection | null>(null)
|
||||
const modpackFile = ref<File | null>(null)
|
||||
const modpackFilePath = ref<string | null>(null)
|
||||
|
||||
// Modpack search state (persisted across stage navigation)
|
||||
const modpackSearchProjectId = ref<string | undefined>()
|
||||
const modpackSearchVersionId = ref<string | undefined>()
|
||||
const modpackSearchOptions = ref<ComboboxOption<string>[]>([])
|
||||
const modpackVersionOptions = ref<ComboboxOption<string>[]>([])
|
||||
const modpackSearchHits = ref<Record<string, ModpackSearchHit>>({})
|
||||
|
||||
// Import state (instance flow only)
|
||||
const importLaunchers = ref<ImportableLauncher[]>([])
|
||||
const importSelectedInstances = ref<Record<string, Set<string>>>({})
|
||||
const importSearchQuery = ref('')
|
||||
|
||||
const hardReset = ref(isInitialSetup)
|
||||
const loading = ref(false)
|
||||
|
||||
// hideLoaderChips: hides the entire loader chips section (only for vanilla world type in world/server flows)
|
||||
const hideLoaderChips = computed(() => setupType.value === 'vanilla')
|
||||
|
||||
// hideLoaderVersion: hides the loader version section (vanilla world type OR vanilla selected as loader chip)
|
||||
const hideLoaderVersion = computed(
|
||||
() => setupType.value === 'vanilla' || selectedLoader.value === 'vanilla',
|
||||
)
|
||||
|
||||
function reset(instanceCount?: number) {
|
||||
setupType.value = null
|
||||
isImportMode.value = false
|
||||
worldCounter++
|
||||
worldName.value = flowType === 'world' ? `World ${worldCounter}` : ''
|
||||
if (instanceCount != null) {
|
||||
instanceCounter = instanceCount
|
||||
}
|
||||
instanceCounter++
|
||||
gamemode.value = 'survival'
|
||||
difficulty.value = 'normal'
|
||||
worldSeed.value = ''
|
||||
worldTypeOption.value = 'minecraft:normal'
|
||||
generateStructures.value = true
|
||||
generatorSettingsMode.value = 'default'
|
||||
generatorSettingsCustom.value = ''
|
||||
|
||||
// Instance-specific
|
||||
instanceName.value = flowType === 'instance' ? `New instance (${instanceCounter})` : ''
|
||||
instanceIconUrl.value = null
|
||||
instanceIcon.value = null
|
||||
instanceIconPath.value = null
|
||||
|
||||
selectedLoader.value = null
|
||||
selectedGameVersion.value = null
|
||||
loaderVersionType.value = 'stable'
|
||||
selectedLoaderVersion.value = null
|
||||
showSnapshots.value = false
|
||||
modpackSelection.value = null
|
||||
modpackFile.value = null
|
||||
modpackFilePath.value = null
|
||||
modpackSearchProjectId.value = undefined
|
||||
modpackSearchVersionId.value = undefined
|
||||
modpackSearchOptions.value = []
|
||||
modpackVersionOptions.value = []
|
||||
modpackSearchHits.value = {}
|
||||
|
||||
// Import state
|
||||
importLaunchers.value = []
|
||||
importSelectedInstances.value = {}
|
||||
importSearchQuery.value = ''
|
||||
|
||||
hardReset.value = isInitialSetup
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
function setSetupType(type: SetupType) {
|
||||
debug('setSetupType:', type)
|
||||
isImportMode.value = false
|
||||
setupType.value = type
|
||||
if (type === 'modpack') {
|
||||
modal.value?.setStage('modpack')
|
||||
} else {
|
||||
// both custom and vanilla go to custom-setup
|
||||
// vanilla just hides loader chips via hideLoaderChips computed
|
||||
modal.value?.setStage('custom-setup')
|
||||
}
|
||||
}
|
||||
|
||||
function setImportMode() {
|
||||
isImportMode.value = true
|
||||
setupType.value = null
|
||||
modal.value?.setStage('import-instance')
|
||||
}
|
||||
|
||||
function browseModpacks() {
|
||||
modal.value?.hide()
|
||||
emit.browseModpacks()
|
||||
}
|
||||
|
||||
function finish() {
|
||||
debug('finish() called, state:', {
|
||||
setupType: setupType.value,
|
||||
selectedLoader: selectedLoader.value,
|
||||
selectedGameVersion: selectedGameVersion.value,
|
||||
selectedLoaderVersion: selectedLoaderVersion.value,
|
||||
modpackSelection: modpackSelection.value,
|
||||
hasModpackFile: !!modpackFile.value,
|
||||
})
|
||||
loading.value = true
|
||||
emit.create(contextValue)
|
||||
}
|
||||
|
||||
function buildProperties(): Archon.Content.v1.PropertiesFields {
|
||||
const isHardcore = gamemode.value === 'hardcore'
|
||||
const known: Archon.Content.v1.KnownPropertiesFields = {
|
||||
gamemode: isHardcore ? 'survival' : gamemode.value,
|
||||
hardcore: isHardcore ? 'true' : 'false',
|
||||
difficulty: difficulty.value,
|
||||
level_seed: worldSeed.value || null,
|
||||
level_type: worldTypeOption.value,
|
||||
generate_structures: String(generateStructures.value),
|
||||
}
|
||||
|
||||
if (generatorSettingsMode.value === 'flat') {
|
||||
known.generator_settings = ''
|
||||
} else if (generatorSettingsMode.value === 'custom' && generatorSettingsCustom.value) {
|
||||
known.generator_settings = generatorSettingsCustom.value
|
||||
}
|
||||
|
||||
return { known }
|
||||
}
|
||||
|
||||
const searchModpacks = options.searchModpacks!
|
||||
const getProjectVersions = options.getProjectVersions!
|
||||
|
||||
const resolvedStageConfigs = disableClose
|
||||
? stageConfigs.map((stage) => ({ ...stage, disableClose: true }))
|
||||
: stageConfigs
|
||||
|
||||
const contextValue: CreationFlowContextValue = {
|
||||
flowType,
|
||||
availableLoaders,
|
||||
showSnapshotToggle,
|
||||
disableClose,
|
||||
isInitialSetup,
|
||||
initialLoader,
|
||||
initialGameVersion,
|
||||
setupType,
|
||||
isImportMode,
|
||||
worldName,
|
||||
gamemode,
|
||||
difficulty,
|
||||
worldSeed,
|
||||
worldTypeOption,
|
||||
generateStructures,
|
||||
generatorSettingsMode,
|
||||
generatorSettingsCustom,
|
||||
instanceName,
|
||||
instanceIcon,
|
||||
instanceIconUrl,
|
||||
instanceIconPath,
|
||||
selectedLoader,
|
||||
selectedGameVersion,
|
||||
loaderVersionType,
|
||||
selectedLoaderVersion,
|
||||
hideLoaderChips,
|
||||
hideLoaderVersion,
|
||||
showSnapshots,
|
||||
modpackSelection,
|
||||
modpackFile,
|
||||
modpackFilePath,
|
||||
modpackSearchProjectId,
|
||||
modpackSearchVersionId,
|
||||
modpackSearchOptions,
|
||||
modpackVersionOptions,
|
||||
modpackSearchHits,
|
||||
importLaunchers,
|
||||
importSelectedInstances,
|
||||
importSearchQuery,
|
||||
hardReset,
|
||||
loading,
|
||||
modal,
|
||||
stageConfigs: resolvedStageConfigs,
|
||||
onBack,
|
||||
reset,
|
||||
setSetupType,
|
||||
setImportMode,
|
||||
browseModpacks,
|
||||
finish,
|
||||
buildProperties,
|
||||
searchModpacks,
|
||||
getProjectVersions,
|
||||
}
|
||||
|
||||
return contextValue
|
||||
}
|
||||
Reference in New Issue
Block a user