Bommels05/Modrinth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance version creation (#535) (#616)

Browse Source
This commit is contained in:
kevoh1516 2022-09-04 13:56:32 -04:00 committed by GitHub
parent 3e221f3b6a
commit 75c41644c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 518 additions and 453 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

185
pages/_type/_id/version.vue
View File

@ -1,48 +1,8 @@
<template> <template>
<div class="content card"> <div>
<ConfirmPopup <header class="card">
ref="delete_version_popup" <div v-if="mode === 'edit'" class="header-buttons buttons columns">
title="Are you sure you want to delete this version?" <h3 class="column-grow-1">Edit version</h3>
description="This will remove this version forever (like really forever)."
:has-to-type="false"
proceed-label="Delete version"
@proceed="deleteVersion()"
/>
<div class="columns">
<nuxt-link
v-if="mode === 'version'"
class="iconified-button back-button"
:to="`/${project.project_type}/${
project.slug ? project.slug : project.id
}/${
$nuxt.context.from
? $nuxt.context.from.name === 'type-id-changelog'
? 'changelog'
: 'versions'
: 'versions'
}`"
>
<BackIcon aria-hidden="true" />
Back to list
</nuxt-link>
</div>
<div v-if="version">
<div v-if="mode === 'version'" class="version-header">
<h2>{{ version.name }}</h2>
<div v-if="version.featured" class="featured">
<StarIcon aria-hidden="true" />
Featured
</div>
<div
v-else-if="featuredVersions.find((x) => x.id === version.id)"
class="featured"
>
<StarIcon aria-hidden="true" />
Auto-featured
</div>
</div>
<div v-if="mode === 'edit'" class="header-buttons buttons">
<nuxt-link <nuxt-link
v-if="$auth.user" v-if="$auth.user"
:to="`/${project.project_type}/${ :to="`/${project.project_type}/${
@ -61,7 +21,8 @@
Save Save
</button> </button>
</div> </div>
<div v-else-if="mode === 'create'" class="header-buttons buttons"> <div v-else-if="mode === 'create'" class="header-buttons buttons columns">
<h3 class="column-grow-1">Create version</h3>
<nuxt-link <nuxt-link
v-if="$auth.user" v-if="$auth.user"
:to="`/${project.project_type}/${ :to="`/${project.project_type}/${
@ -120,6 +81,71 @@
Edit Edit
</nuxt-link> </nuxt-link>
</div> </div>
<div v-if="showKnownErrors" class="known-errors">
<ul>
<li v-if="version.version_number === ''">
Your version must have a version number.
</li>
<li v-if="version.game_versions.length === 0">
Your version must have the supported Minecraft versions selected.
</li>
<li v-if="newFiles.length === 0 && version.files.length === 0">
Your version must have a file uploaded.
</li>
<li
v-if="
version.loaders.length === 0 &&
project.project_type !== 'resourcepack'
"
>
Your version must have the supported mod loaders selected.
</li>
</ul>
</div>
</header>
<div class="content card">
<ConfirmPopup
ref="delete_version_popup"
title="Are you sure you want to delete this version?"
description="This will remove this version forever (like really forever)."
:has-to-type="false"
proceed-label="Delete version"
@proceed="deleteVersion()"
/>
<div class="columns">
<nuxt-link
v-if="mode === 'version'"
class="iconified-button back-button"
:to="`/${project.project_type}/${
project.slug ? project.slug : project.id
}/${
$nuxt.context.from
? $nuxt.context.from.name === 'type-id-changelog'
? 'changelog'
: 'versions'
: 'versions'
}`"
>
<BackIcon aria-hidden="true" />
Back to list
</nuxt-link>
</div>
<div v-if="version">
<div v-if="mode === 'version'" class="version-header">
<h2>{{ version.name }}</h2>
<div v-if="version.featured" class="featured">
<StarIcon aria-hidden="true" />
Featured
</div>
<div
v-else-if="featuredVersions.find((x) => x.id === version.id)"
class="featured"
>
<StarIcon aria-hidden="true" />
Auto-featured
</div>
</div>
<div <div
v-if="mode === 'edit' || mode === 'create'" v-if="mode === 'edit' || mode === 'create'"
class="version-data-inputs" class="version-data-inputs"
@ -128,7 +154,7 @@
v-model="version.name" v-model="version.name"
class="full-width-input" class="full-width-input"
type="text" type="text"
placeholder="Enter the version name..." placeholder="Enter an optional version name..."
/> />
<Checkbox v-model="version.featured" label="Featured" /> <Checkbox v-model="version.featured" label="Featured" />
<hr class="card-divider" /> <hr class="card-divider" />
@ -210,7 +236,7 @@
/> />
</div> </div>
<div v-if="project.project_type !== 'resourcepack'" class="data"> <div v-if="project.project_type !== 'resourcepack'" class="data">
<p class="title">Loaders</p> <p class="title">Loaders<span class="required">*</span></p>
<multiselect <multiselect
v-if="mode === 'edit' || mode === 'create'" v-if="mode === 'edit' || mode === 'create'"
v-model="version.loaders" v-model="version.loaders"
@ -244,7 +270,7 @@
<p class="value">{{ $formatNumber(version.downloads) }}</p> <p class="value">{{ $formatNumber(version.downloads) }}</p>
</div> </div>
<div class="data"> <div class="data">
<p class="title">Version number</p> <p class="title">Version number<span class="required">*</span></p>
<input <input
v-if="mode === 'edit' || mode === 'create'" v-if="mode === 'edit' || mode === 'create'"
v-model="version.version_number" v-model="version.version_number"
@ -254,7 +280,9 @@
<p v-else class="value">{{ version.version_number }}</p> <p v-else class="value">{{ version.version_number }}</p>
</div> </div>
<div class="data"> <div class="data">
<p class="title">Minecraft versions</p> <p class="title">
Minecraft versions<span class="required">*</span>
</p>
<div v-if="mode === 'edit' || mode === 'create'"> <div v-if="mode === 'edit' || mode === 'create'">
<multiselect <multiselect
v-model="version.game_versions" v-model="version.game_versions"
@ -292,7 +320,9 @@
<p class="title">Published</p> <p class="title">Published</p>
<p class="value"> <p class="value">
{{ $dayjs(version.date_published).format('MMM D, YYYY') }} {{ $dayjs(version.date_published).format('MMM D, YYYY') }}
<span v-if="members.find((x) => x.user.id === version.author_id)"> <span
v-if="members.find((x) => x.user.id === version.author_id)"
>
by by
<nuxt-link <nuxt-link
class="text-link" class="text-link"
@ -457,9 +487,11 @@
<hr class="card-divider" /> <hr class="card-divider" />
</section> </section>
<section <section
v-if="version.files.length > 0 || mode === 'edit' || mode === 'create'" v-if="
version.files.length > 0 || mode === 'edit' || mode === 'create'
"
> >
<h3>Files</h3> <h3>Files<span class="required">*</span></h3>
<div <div
v-for="(file, index) in version.files" v-for="(file, index) in version.files"
:key="file.hashes.sha1" :key="file.hashes.sha1"
@ -539,14 +571,14 @@
@change="(x) => x.forEach((y) => newFiles.push(y))" @change="(x) => x.forEach((y) => newFiles.push(y))"
/> />
<span v-if="mode === 'edit' || mode === 'create'"> <span v-if="mode === 'edit' || mode === 'create'">
You may upload multiple files, but this should only be used for cases You may upload multiple files, but this should only be used for
like sources or Javadocs. cases like sources or Javadocs.
<p <p
v-if="project.project_type.toLowerCase() === 'modpack'" v-if="project.project_type.toLowerCase() === 'modpack'"
aria-label="Warning" aria-label="Warning"
> >
Modpack support is currently in alpha, and you may encounter issues. Modpack support is currently in alpha, and you may encounter
Our documentation includes instructions on issues. Our documentation includes instructions on
<a <a
href="https://docs.modrinth.com/docs/modpacks/creating_modpacks/" href="https://docs.modrinth.com/docs/modpacks/creating_modpacks/"
target="_blank" target="_blank"
@ -566,6 +598,7 @@
</div> </div>
<NuxtChild v-show="false" :mode.sync="mode" /> <NuxtChild v-show="false" :mode.sync="mode" />
</div> </div>
</div>
</template> </template>
<script> <script>
import Multiselect from 'vue-multiselect' import Multiselect from 'vue-multiselect'
@ -673,6 +706,8 @@ export default {
newFiles: [], newFiles: [],
deleteFiles: [], deleteFiles: [],
showSnapshots: false, showSnapshots: false,
showKnownErrors: false,
} }
}, },
async fetch() { async fetch() {
@ -698,6 +733,19 @@ export default {
} }
}, },
methods: { methods: {
checkFields() {
if (
this.version.version_number === '' ||
this.version.game_versions.length === 0 ||
(this.version.loaders.length === 0 &&
this.project.project_type !== 'resourcepack') ||
(this.newFiles.length === 0 && this.version.files.length === 0)
) {
return false
}
return true
},
reset() { reset() {
this.changelogViewMode = 'source' this.changelogViewMode = 'source'
this.dependencyAddMode = 'project' this.dependencyAddMode = 'project'
@ -749,7 +797,6 @@ export default {
statusCode: 404, statusCode: 404,
message: 'The page could not be found', message: 'The page could not be found',
}) })
return return
} }
@ -830,6 +877,14 @@ export default {
}, },
async saveEditedVersion() { async saveEditedVersion() {
this.$nuxt.$loading.start() this.$nuxt.$loading.start()
if (!this.checkFields()) {
this.showKnownErrors = true
this.$nuxt.$loading.finish()
return
}
this.showKnownErrors = false
try { try {
if (this.newFiles.length > 0) { if (this.newFiles.length > 0) {
const formData = new FormData() const formData = new FormData()
@ -861,9 +916,9 @@ export default {
} }
this.version.primary_file = ['sha1', this.primaryFile.hashes.sha1] this.version.primary_file = ['sha1', this.primaryFile.hashes.sha1]
const copyVersion = JSON.parse(JSON.stringify(this.version)) const copyVersion = JSON.parse(JSON.stringify(this.version))
delete copyVersion.downloads delete copyVersion.downloads
copyVersion.name = copyVersion.name || copyVersion.version_number
await this.$axios.patch( await this.$axios.patch(
`version/${this.version.id}`, `version/${this.version.id}`,
copyVersion, copyVersion,
@ -914,6 +969,13 @@ export default {
async createVersion() { async createVersion() {
this.$nuxt.$loading.start() this.$nuxt.$loading.start()
if (!this.checkFields()) {
this.showKnownErrors = true
this.$nuxt.$loading.finish()
return
}
this.showKnownErrors = false
const formData = new FormData() const formData = new FormData()
const fileParts = this.newFiles.map((f, idx) => `${f.name}-${idx}`) const fileParts = this.newFiles.map((f, idx) => `${f.name}-${idx}`)
@ -926,7 +988,7 @@ export default {
project_id: this.version.project_id, project_id: this.version.project_id,
file_parts: fileParts, file_parts: fileParts,
version_number: this.version.version_number, version_number: this.version.version_number,
version_title: this.version.name, version_title: this.version.name || this.version.version_number,
version_body: this.version.changelog, version_body: this.version.changelog,
dependencies: this.version.dependencies, dependencies: this.version.dependencies,
game_versions: this.version.game_versions, game_versions: this.version.game_versions,
@ -960,7 +1022,6 @@ export default {
const newProject = JSON.parse(JSON.stringify(this.project)) const newProject = JSON.parse(JSON.stringify(this.project))
newProject.versions = newProject.versions.concat([data.id]) newProject.versions = newProject.versions.concat([data.id])
const newVersions = this.$computeVersions(this.versions.concat([data])) const newVersions = this.$computeVersions(this.versions.concat([data]))
await this.$emit('update:project', newProject) await this.$emit('update:project', newProject)
@ -1006,6 +1067,10 @@ export default {
max-width: calc(100% - (2 * var(--spacing-card-lg))); max-width: calc(100% - (2 * var(--spacing-card-lg)));
} }
.required {
color: var(--color-badge-red-bg);
}
.version-header { .version-header {
display: flex; display: flex;
align-items: center; align-items: center;