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:
Calum H.
110
apps/app-frontend/src/providers/setup/creation-modal.ts
Normal file
110
apps/app-frontend/src/providers/setup/creation-modal.ts
Normal file
@@ -0,0 +1,110 @@
|
||||
import type { AbstractWebNotificationManager, CreationFlowContextValue } from '@modrinth/ui'
|
||||
import { provide, useTemplateRef } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
import { trackEvent } from '@/helpers/analytics'
|
||||
import { get_project_versions, get_search_results } from '@/helpers/cache.js'
|
||||
import { import_instance } from '@/helpers/import.js'
|
||||
import { create_profile_and_install, create_profile_and_install_from_file } from '@/helpers/pack'
|
||||
import { create, list } from '@/helpers/profile.js'
|
||||
|
||||
export function setupCreationModal(notificationManager: AbstractWebNotificationManager) {
|
||||
const { handleError } = notificationManager
|
||||
const router = useRouter()
|
||||
|
||||
const installationModal = useTemplateRef('installationModal')
|
||||
provide('showCreationModal', async () => {
|
||||
const instances = await list().catch(handleError)
|
||||
installationModal.value?.show(instances?.length ?? 0)
|
||||
})
|
||||
|
||||
async function handleCreate(config: CreationFlowContextValue) {
|
||||
installationModal.value?.hide()
|
||||
|
||||
try {
|
||||
if (config.isImportMode.value) {
|
||||
for (const [launcherName, instanceSet] of Object.entries(
|
||||
config.importSelectedInstances.value,
|
||||
)) {
|
||||
const launcher = config.importLaunchers.value.find((l) => l.name === launcherName)
|
||||
if (!launcher || instanceSet.size === 0) continue
|
||||
for (const name of instanceSet) {
|
||||
await import_instance(launcher.name, launcher.path, name).catch(handleError)
|
||||
}
|
||||
}
|
||||
trackEvent('InstanceCreate', { source: 'CreationModalImport' })
|
||||
return
|
||||
}
|
||||
|
||||
if (config.modpackSelection.value) {
|
||||
const { projectId, versionId, name, iconUrl } = config.modpackSelection.value
|
||||
await create_profile_and_install(projectId, versionId, name, iconUrl).catch(handleError)
|
||||
trackEvent('InstanceCreate', { source: 'CreationModalModpack' })
|
||||
return
|
||||
}
|
||||
|
||||
if (config.modpackFilePath.value) {
|
||||
await create_profile_and_install_from_file(config.modpackFilePath.value).catch(handleError)
|
||||
trackEvent('InstanceCreate', { source: 'CreationModalModpackFile' })
|
||||
return
|
||||
}
|
||||
|
||||
// Custom/vanilla setup
|
||||
const loader = config.hideLoaderChips.value
|
||||
? 'vanilla'
|
||||
: (config.selectedLoader.value ?? 'vanilla')
|
||||
const loaderVersion = config.hideLoaderVersion.value
|
||||
? null
|
||||
: (config.selectedLoaderVersion.value ?? config.loaderVersionType.value)
|
||||
const iconPath = config.instanceIconPath.value ?? null
|
||||
|
||||
await create(
|
||||
config.instanceName.value,
|
||||
config.selectedGameVersion.value,
|
||||
loader,
|
||||
loaderVersion,
|
||||
iconPath,
|
||||
false,
|
||||
).catch(handleError)
|
||||
|
||||
trackEvent('InstanceCreate', {
|
||||
profile_name: config.instanceName.value,
|
||||
game_version: config.selectedGameVersion.value,
|
||||
loader,
|
||||
loader_version: loaderVersion,
|
||||
has_icon: !!iconPath,
|
||||
source: 'CreationModal',
|
||||
})
|
||||
} catch (err) {
|
||||
handleError(err)
|
||||
}
|
||||
}
|
||||
|
||||
function handleBrowseModpacks() {
|
||||
installationModal.value?.hide()
|
||||
router.push('/browse/modpack')
|
||||
}
|
||||
|
||||
async function searchModpacks(query: string, limit: number = 10) {
|
||||
const params = [`facets=[["project_type:modpack"]]`, `limit=${limit}`]
|
||||
if (query) {
|
||||
params.push(`query=${encodeURIComponent(query)}`)
|
||||
}
|
||||
const raw = await get_search_results(`?${params.join('&')}`)
|
||||
if (raw?.result) return raw.result
|
||||
return { hits: [], offset: 0, limit, total_hits: 0 }
|
||||
}
|
||||
|
||||
async function getProjectVersions(projectId: string) {
|
||||
const versions = await get_project_versions(projectId)
|
||||
return versions ?? []
|
||||
}
|
||||
|
||||
return {
|
||||
installationModal,
|
||||
handleCreate,
|
||||
handleBrowseModpacks,
|
||||
searchModpacks,
|
||||
getProjectVersions,
|
||||
}
|
||||
}
|
||||
32
apps/app-frontend/src/providers/setup/file-picker.ts
Normal file
32
apps/app-frontend/src/providers/setup/file-picker.ts
Normal file
@@ -0,0 +1,32 @@
|
||||
import { provideFilePicker } from '@modrinth/ui'
|
||||
import { convertFileSrc } from '@tauri-apps/api/core'
|
||||
import { open } from '@tauri-apps/plugin-dialog'
|
||||
|
||||
export function setupFilePickerProvider() {
|
||||
provideFilePicker({
|
||||
async pickImage() {
|
||||
const result = await open({
|
||||
multiple: false,
|
||||
filters: [{ name: 'Image', extensions: ['png', 'jpeg', 'jpg', 'svg', 'webp', 'gif'] }],
|
||||
})
|
||||
if (!result) return null
|
||||
const path = result.path ?? result
|
||||
if (!path) return null
|
||||
const name = path.split(/[\\/]/).pop() || 'icon'
|
||||
const file = new File([], name)
|
||||
return { file, path, previewUrl: convertFileSrc(path) }
|
||||
},
|
||||
async pickModpackFile() {
|
||||
const result = await open({
|
||||
multiple: false,
|
||||
filters: [{ name: 'Modpack', extensions: ['mrpack'] }],
|
||||
})
|
||||
if (!result) return null
|
||||
const path = result.path ?? result
|
||||
if (!path) return null
|
||||
const name = path.split(/[\\/]/).pop() || 'modpack.mrpack'
|
||||
const file = new File([], name)
|
||||
return { file, path, previewUrl: '' }
|
||||
},
|
||||
})
|
||||
}
|
||||
47
apps/app-frontend/src/providers/setup/instance-import.ts
Normal file
47
apps/app-frontend/src/providers/setup/instance-import.ts
Normal file
@@ -0,0 +1,47 @@
|
||||
import type { AbstractWebNotificationManager } from '@modrinth/ui'
|
||||
import { provideInstanceImport } from '@modrinth/ui'
|
||||
import { open } from '@tauri-apps/plugin-dialog'
|
||||
|
||||
import {
|
||||
get_default_launcher_path,
|
||||
get_importable_instances,
|
||||
import_instance,
|
||||
} from '@/helpers/import.js'
|
||||
|
||||
export function setupInstanceImportProvider(notificationManager: AbstractWebNotificationManager) {
|
||||
const { handleError } = notificationManager
|
||||
|
||||
provideInstanceImport({
|
||||
async getDetectedLaunchers() {
|
||||
const launcherNames = ['MultiMC', 'GDLauncher', 'ATLauncher', 'Curseforge', 'PrismLauncher']
|
||||
const launchers = []
|
||||
for (const name of launcherNames) {
|
||||
try {
|
||||
const path = await get_default_launcher_path(name)
|
||||
if (!path) continue
|
||||
const instances = await get_importable_instances(name, path)
|
||||
if (instances?.length > 0) {
|
||||
launchers.push({ name, path, instances })
|
||||
}
|
||||
} catch {
|
||||
// Skip launchers that fail detection
|
||||
}
|
||||
}
|
||||
return launchers
|
||||
},
|
||||
async getImportableInstances(launcherName: string, path: string) {
|
||||
return (await get_importable_instances(launcherName, path)) ?? []
|
||||
},
|
||||
async importInstances(selections) {
|
||||
for (const sel of selections) {
|
||||
for (const instanceName of sel.instanceNames) {
|
||||
await import_instance(sel.launcher, sel.path, instanceName).catch(handleError)
|
||||
}
|
||||
}
|
||||
},
|
||||
async selectDirectory() {
|
||||
const result = await open({ multiple: false, directory: true })
|
||||
return result?.toString() ?? null
|
||||
},
|
||||
})
|
||||
}
|
||||
24
apps/app-frontend/src/providers/setup/tags.ts
Normal file
24
apps/app-frontend/src/providers/setup/tags.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
import type { AbstractWebNotificationManager } from '@modrinth/ui'
|
||||
import { provideTags } from '@modrinth/ui'
|
||||
import { ref } from 'vue'
|
||||
|
||||
import { get_game_versions, get_loaders } from '@/helpers/tags'
|
||||
|
||||
export function setupTagsProvider(notificationManager: AbstractWebNotificationManager) {
|
||||
const { handleError } = notificationManager
|
||||
|
||||
const gameVersions = ref([])
|
||||
const loaders = ref([])
|
||||
get_game_versions()
|
||||
.then((v) => {
|
||||
gameVersions.value = v
|
||||
})
|
||||
.catch(handleError)
|
||||
get_loaders()
|
||||
.then((v) => {
|
||||
loaders.value = v
|
||||
})
|
||||
.catch(handleError)
|
||||
|
||||
provideTags({ gameVersions, loaders })
|
||||
}
|
||||
Reference in New Issue
Block a user