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

Fix org ownership (#1553)

Browse Source
This commit is contained in:
Geometrically 2024-01-10 15:13:37 -05:00 committed by GitHub
parent 354bfe58cd
commit 5924154a62
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 98 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
assets/images/utils/crown.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-crown"><path d="m2 4 3 12h14l3-12-6 7-4-7-4 7-6-7zm3 16h14"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 270 B

26
pages/[type]/[id].vue
View File

@ -637,7 +637,9 @@
>
<Avatar :src="organization.icon_url" :alt="organization.name" size="sm" />
<div class="member-info">
<p class="name">{{ organization.name }}</p>
<p class="name">
{{ organization.name }}
</p>
<p class="role"><OrganizationIcon /> Organization</p>
</div>
</nuxt-link>
@ -650,7 +652,9 @@
<Avatar :src="member.avatar_url" :alt="member.username" size="sm" circle />
<div class="member-info">
<p class="name">{{ member.name }}</p>
<p class="name">
{{ member.name }} <CrownIcon v-if="member.is_owner" v-tooltip="'Project owner'" />
</p>
<p class="role">
{{ member.role }}
</p>
@ -766,6 +770,7 @@ import {
Checkbox,
ChartIcon,
} from 'omorphia'
import CrownIcon from '~/assets/images/utils/crown.svg'
import CalendarIcon from '~/assets/images/utils/calendar.svg'
import ClearIcon from '~/assets/images/utils/clear.svg'
import DownloadIcon from '~/assets/images/utils/download.svg'
@ -878,7 +883,7 @@ try {
}),
useAsyncData(
`project/${route.params.id}/members`,
() => useBaseFetch(`project/${route.params.id}/members`),
() => useBaseFetch(`project/${route.params.id}/members`, { apiVersion: 3 }),
{
transform: (members) => {
members.forEach((it, index) => {
@ -939,8 +944,8 @@ if (project.value.project_type !== route.params.type || route.params.id !== proj
// The rest of the members should be sorted by role, then by name
const members = computed(() => {
const acceptedMembers = allMembers.value.filter((x) => x.accepted)
const owner = acceptedMembers.find((x) => x.role === 'Owner')
const rest = acceptedMembers.filter((x) => x.role !== 'Owner') || []
const owner = acceptedMembers.find((x) => x.is_owner)
const rest = acceptedMembers.filter((x) => !x.is_owner) || []
rest.sort((a, b) => {
if (a.role === b.role) {
@ -1017,9 +1022,7 @@ const description = computed(
() =>
`${project.value.description} - Download the Minecraft ${projectTypeDisplay.value} ${
project.value.title
} by ${
members.value.find((x) => x.role === 'Owner')?.user?.username || 'a Creator'
} on Modrinth`
} by ${members.value.find((x) => x.is_owner)?.user?.username || 'a Creator'} on Modrinth`
)
if (!route.name.startsWith('type-id-settings')) {
@ -1409,6 +1412,13 @@ const collapsedChecklist = ref(false)
.name {
font-weight: bold;
display: flex;
align-items: center;
gap: 0.25rem;
svg {
color: var(--color-orange);
}
}
p {

58
pages/[type]/[id]/settings/members.vue
View File

@ -47,7 +47,7 @@
</span>
<button
class="iconified-button danger-button"
:disabled="props.currentMember?.role === 'Owner'"
:disabled="props.currentMember?.is_owner"
@click="leaveProject()"
>
<UserRemoveIcon />
@ -67,6 +67,7 @@
<div class="text">
<nuxt-link :to="'/user/' + member.user.username" class="name">
<p>{{ member.name }}</p>
<CrownIcon v-if="member.is_owner" v-tooltip="'Project owner'" />
</nuxt-link>
<p>{{ member.role }}</p>
</div>
@ -87,7 +88,7 @@
</div>
</div>
<div class="content">
<div v-if="member.oldRole !== 'Owner'" class="adjacent-input">
<div class="adjacent-input">
<label :for="`member-${allTeamMembers[index].user.username}-role`">
<span class="label__title">Role</span>
<span class="label__description">
@ -98,7 +99,6 @@
:id="`member-${allTeamMembers[index].user.username}-role`"
v-model="allTeamMembers[index].role"
type="text"
:class="{ 'known-error': member.role === 'Owner' }"
:disabled="(props.currentMember?.permissions & EDIT_MEMBER) !== EDIT_MEMBER"
/>
</div>
@ -117,11 +117,7 @@
:disabled="(props.currentMember?.permissions & EDIT_MEMBER) !== EDIT_MEMBER"
/>
</div>
<p v-if="member.role === 'Owner' && member.oldRole !== 'Owner'" class="known-errors">
A project can only have one 'Owner'. Use the 'Transfer ownership' button below if you no
longer wish to be owner.
</p>
<template v-if="member.oldRole !== 'Owner'">
<template v-if="!member.is_owner">
<span class="label">
<span class="label__title">Permissions</span>
</span>
@ -225,7 +221,7 @@
Save changes
</button>
<button
v-if="member.oldRole !== 'Owner'"
v-if="!member.is_owner"
class="iconified-button danger-button"
:disabled="(props.currentMember?.permissions & EDIT_MEMBER) !== EDIT_MEMBER"
@click="removeTeamMember(index)"
@ -234,9 +230,7 @@
Remove member
</button>
<button
v-if="
member.oldRole !== 'Owner' && props.currentMember?.role === 'Owner' && member.accepted
"
v-if="!member.is_owner && props.currentMember?.is_owner && member.accepted"
class="iconified-button"
@click="transferOwnership(index)"
>
@ -300,7 +294,7 @@
:show-labels="false"
:allow-empty="false"
:options="organizations || []"
:disabled="props.currentMember?.role !== 'Owner' || organizations?.length === 0"
:disabled="!props.currentMember?.is_owner || organizations?.length === 0"
/>
<button class="btn btn-primary" :disabled="!selectedOrganization" @click="onAddToOrg">
<CheckIcon />
@ -324,6 +318,7 @@
<div class="text">
<nuxt-link :to="'/user/' + member.user.username" class="name">
<p>{{ member.user.username }}</p>
<CrownIcon v-if="member.is_owner" v-tooltip="'Organization owner'" />
</nuxt-link>
<p>{{ member.role }}</p>
</div>
@ -344,7 +339,7 @@
</div>
</div>
<div class="content">
<div v-if="!member.is_owner" class="adjacent-input">
<div class="adjacent-input">
<label :for="`member-${allOrgMembers[index].user.username}-override-perms`">
<span class="label__title">Override values</span>
<span class="label__description">
@ -529,6 +524,7 @@ import SaveIcon from '~/assets/images/utils/save.svg'
import UserPlusIcon from '~/assets/images/utils/user-plus.svg'
import UserRemoveIcon from '~/assets/images/utils/user-x.svg'
import OrganizationIcon from '~/assets/images/utils/organization.svg'
import CrownIcon from '~/assets/images/utils/crown.svg'
import { removeSelfFromTeam } from '~/helpers/teams.js'
@ -600,9 +596,9 @@ function initMembers() {
allOrgMembers.value = selectedMembersForOrg
allTeamMembers.value = props.allMembers
.map((x) => ({ ...x, oldRole: x.role }))
.filter((x) => !selectedMembersForOrg.some((y) => y.user.id === x.user.id))
allTeamMembers.value = props.allMembers.filter(
(x) => !selectedMembersForOrg.some((y) => y.user.id === x.user.id)
)
}
watch(
@ -737,16 +733,16 @@ const updateTeamMember = async (index) => {
startLoading()
try {
const data =
allTeamMembers.value[index].oldRole !== 'Owner'
? {
permissions: allTeamMembers.value[index].permissions,
role: allTeamMembers.value[index].role,
payouts_split: allTeamMembers.value[index].payouts_split,
}
: {
payouts_split: allTeamMembers.value[index].payouts_split,
}
const data = !allTeamMembers.value[index].is_owner
? {
permissions: allTeamMembers.value[index].permissions,
role: allTeamMembers.value[index].role,
payouts_split: allTeamMembers.value[index].payouts_split,
}
: {
payouts_split: allTeamMembers.value[index].payouts_split,
role: allTeamMembers.value[index].role,
}
await useBaseFetch(
`team/${props.project.team}/members/${allTeamMembers.value[index].user.id}`,
@ -900,6 +896,14 @@ const updateMembers = async () => {
font-size: var(--font-size-sm);
.name {
font-weight: bold;
display: flex;
align-items: center;
gap: 0.25rem;
svg {
color: var(--color-orange);
}
}
p {
margin: 0.2rem 0;

18
pages/organization/[id].vue
View File

@ -107,7 +107,10 @@
<template v-for="member in acceptedMembers" :key="member.user.id">
<nuxt-link class="creator button-base" :to="`/user/${member.user.username}`">
<Avatar :src="member.user.avatar_url" circle />
<p class="name">{{ member.user.username }}</p>
<p class="name">
{{ member.user.username }}
<CrownIcon v-if="member.is_owner" v-tooltip="'Organization owner'" />
</p>
<p class="role">{{ member.role }}</p>
</nuxt-link>
</template>
@ -226,6 +229,7 @@ import UpToDate from '~/assets/images/illustrations/up_to_date.svg'
import ProjectCard from '~/components/ui/ProjectCard.vue'
import OrganizationIcon from '~/assets/images/utils/organization.svg'
import CrownIcon from '~/assets/images/utils/crown.svg'
import { acceptTeamInvite, removeTeamMember } from '~/helpers/teams.js'
const vintl = useVIntl()
@ -269,8 +273,8 @@ if (!organization.value) {
// Filter accepted, sort by role, then by name and Owner role always goes first
const acceptedMembers = computed(() => {
const acceptedMembers = organization.value.members?.filter((x) => x.accepted)
const owner = acceptedMembers.find((x) => x.role === 'Owner')
const rest = acceptedMembers.filter((x) => x.role !== 'Owner') || []
const owner = acceptedMembers.find((x) => x.is_owner)
const rest = acceptedMembers.filter((x) => !x.is_owner) || []
rest.sort((a, b) => {
if (a.role === b.role) {
@ -446,6 +450,14 @@ useSeoMeta({
align-self: flex-end;
margin-left: var(--gap-xs);
font-weight: bold;
display: flex;
align-items: center;
gap: 0.25rem;
svg {
color: var(--color-orange);
}
}
.role {

66
pages/organization/[id]/settings/members.vue
View File

@ -51,7 +51,7 @@
</span>
<Button
color="danger"
:disabled="currentMember.role === 'Owner'"
:disabled="currentMember.is_owner"
@click="() => onLeaveProject(organization.team_id, auth.user.id)"
>
<UserRemoveIcon />
@ -71,6 +71,7 @@
<div class="text">
<nuxt-link :to="'/user/' + member.user.username" class="name">
<p>{{ member.user.username }}</p>
<CrownIcon v-if="member.is_owner" v-tooltip="'Organization owner'" />
</nuxt-link>
<p>{{ member.role }}</p>
</div>
@ -93,7 +94,7 @@
</div>
</div>
<div class="content">
<div v-if="member.oldRole !== 'Owner'" class="adjacent-input">
<div class="adjacent-input">
<label :for="`member-${member.user.id}-role`">
<span class="label__title">Role</span>
<span class="label__description">
@ -104,7 +105,6 @@
:id="`member-${member.user.id}-role`"
v-model="member.role"
type="text"
:class="{ 'known-error': member.role === 'Owner' }"
:disabled="
!isPermission(
currentMember.organization_permissions,
@ -133,11 +133,7 @@
"
/>
</div>
<p v-if="member.role === 'Owner' && member.oldRole !== 'Owner'" class="known-errors">
A organization can only have one 'Owner'. Use the 'Transfer ownership' button below if you
no longer wish to be owner.
</p>
<template v-if="member.oldRole !== 'Owner'">
<template v-if="!member.is_owner">
<span class="label">
<span class="label__title">Project permissions</span>
</span>
@ -157,7 +153,7 @@
/>
</div>
</template>
<template v-if="member.oldRole !== 'Owner'">
<template v-if="!member.is_owner">
<span class="label">
<span class="label__title">Organization permissions</span>
</span>
@ -192,7 +188,7 @@
Save changes
</Button>
<Button
v-if="member.oldRole !== 'Owner'"
v-if="!member.is_owner"
color="danger"
:disabled="
!isPermission(
@ -210,7 +206,7 @@
Remove member
</Button>
<Button
v-if="member.oldRole !== 'Owner' && currentMember.role === 'Owner' && member.accepted"
v-if="!member.is_owner && currentMember.is_owner && member.accepted"
@click="() => onTransferOwnership(organization.team_id, member.user.id)"
>
<TransferIcon />
@ -234,8 +230,9 @@ import {
DropdownIcon,
Button,
} from 'omorphia'
import { ref } from 'vue'
import CrownIcon from '~/assets/images/utils/crown.svg'
import { removeTeamMember } from '~/helpers/teams.js'
import { isPermission } from '~/utils/permissions.ts'
@ -246,20 +243,13 @@ const auth = await useAuth()
const currentUsername = ref('')
const openTeamMembers = ref([])
const processMembers = (members) => {
return members
.map((x) => ({ ...x, oldRole: x.role }))
.sort((a, b) => a.user.username.localeCompare(b.user.username))
}
const allTeamMembers = ref(processMembers(organization.value.members))
const allTeamMembers = ref(organization.value.members)
watch(
() => organization.value,
() => {
allTeamMembers.value = processMembers(organization.value.members)
},
{ deep: true, immediate: true }
allTeamMembers.value = organization.value.members
}
)
const projectPermissions = {
@ -329,17 +319,17 @@ const onRemoveMember = useClientTry(async (teamId, member) => {
})
const onUpdateTeamMember = useClientTry(async (teamId, member) => {
const data =
member.oldRole !== 'Owner'
? {
permissions: member.permissions,
organization_permissions: member.organization_permissions,
role: member.role,
payouts_split: member.payouts_split,
}
: {
payouts_split: member.payouts_split,
}
const data = !member.is_owner
? {
permissions: member.permissions,
organization_permissions: member.organization_permissions,
role: member.role,
payouts_split: member.payouts_split,
}
: {
payouts_split: member.payouts_split,
role: member.role,
}
await useBaseFetch(`team/${teamId}/members/${member.user.id}`, {
method: 'PATCH',
body: data,
@ -381,9 +371,19 @@ const onTransferOwnership = useClientTry(async (teamId, uid) => {
.text {
margin: auto 0 auto 0.5rem;
font-size: var(--font-size-sm);
.name {
font-weight: bold;
display: flex;
align-items: center;
gap: 0.25rem;
svg {
color: var(--color-orange);
}
}
p {
margin: 0.2rem 0;
}