11<script lang="ts" setup>
22import type { Member , ProjectRoleBigint , ProjectV2 } from ' @cpn-console/shared'
3- import { PROJECT_PERMS , projectPermsDetails , shallowEqual } from ' @cpn-console/shared'
3+ import { isManagedRole , isSystemRole , PROJECT_PERMS , projectPermsDetails , shallowEqual } from ' @cpn-console/shared'
44import { computed , ref } from ' vue'
55
66const props = defineProps <{
@@ -29,6 +29,21 @@ const role = ref({
2929 type: props .type ?? ' managed' ,
3030})
3131
32+ const isSystem = computed (() => isSystemRole (role .value .type ))
33+ const isManaged = computed (() => isManagedRole (role .value .type ))
34+ const systemTypePrefix = ' system:'
35+ const roleTypeForSelect = computed ({
36+ get() {
37+ const type = role .value .type
38+ if (type ?.startsWith (systemTypePrefix )) return type .slice (systemTypePrefix .length )
39+ return type ?? ' managed'
40+ },
41+ set(value ) {
42+ if (role .value .type ?.startsWith (systemTypePrefix )) role .value .type = ` ${systemTypePrefix }${value } `
43+ else role .value .type = value
44+ },
45+ })
46+
3247const isUpdated = computed (() => {
3348 if (role .value .isEveryone ) return props .permissions !== role .value .permissions
3449 return ! shallowEqual (props , role .value )
@@ -38,7 +53,7 @@ const tabListName = 'Liste d’onglet'
3853const tabTitles = computed (() => [
3954 { title: ' Général' , icon: ' ri:checkbox-circle-line' , tabId: ' general' },
4055 ... (
41- role .value . type === ' managed '
56+ isManaged .value
4257 ? [{ title: ' Membres' , icon: ' ri:checkbox-circle-line' , tabId: ' members' }]
4358 : []),
4459 { title: ' Fermer' , icon: ' ri:close-line' , tabId: ' close' },
@@ -74,30 +89,34 @@ const typeOptions = [
7489 panel-id =" general"
7590 tab-id =" general"
7691 >
77- <h6 >Nom du rôle</h6 >
7892 <DsfrInput
7993 v-model =" role.name"
8094 data-testid =" roleNameInput"
95+ label =" Nom du rôle"
8196 label-visible
8297 class =" mb-5"
83- :disabled =" role.isEveryone"
84- />
85- <h6 >Type</h6 >
86- <DsfrSelect
87- v-model =" role.type"
88- select-id =" roleTypeSelect"
89- :options =" typeOptions"
90- class =" mb-5"
91- :disabled =" role.isEveryone"
92- />
93- <h6 >Groupe OIDC</h6 >
94- <DsfrInput
95- v-model =" role.oidcGroup"
96- data-testid =" roleOidcGroupInput"
97- label-visible
98- class =" mb-5"
99- :disabled =" role.isEveryone"
98+ :disabled =" role.isEveryone || isSystem"
10099 />
100+ <template v-if =" ! role .isEveryone " >
101+ <DsfrSelect
102+ v-model =" roleTypeForSelect"
103+ data-testid =" roleTypeSelect"
104+ select-id =" roleTypeSelect"
105+ label =" Type"
106+ label-visible
107+ :options =" typeOptions"
108+ class =" mb-5"
109+ :disabled =" isSystem"
110+ />
111+ <DsfrInput
112+ v-model =" role.oidcGroup"
113+ data-testid =" roleOidcGroupInput"
114+ label =" Groupe OIDC"
115+ label-visible
116+ class =" mb-5"
117+ :disabled =" isSystem"
118+ />
119+ </template >
101120 <h6 >Permissions</h6 >
102121 <div
103122 v-for =" scope in projectPermsDetails"
@@ -117,20 +136,20 @@ const typeOptions = [
117136 :label =" perm?.label"
118137 :hint =" perm?.hint"
119138 :name =" perm.key"
120- :disabled =" (role.permissions & PROJECT_PERMS.MANAGE && perm.key !== 'MANAGE')"
139+ :disabled =" isSystem || (role.permissions & PROJECT_PERMS.MANAGE && perm.key !== 'MANAGE')"
121140 @update:model-value =" (checked: boolean) => updateChecked(checked, PROJECT_PERMS[perm.key])"
122141 />
123142 </div >
124143 <DsfrButton
125144 label =" Enregistrer"
126145 data-testid =" saveBtn"
127146 secondary
128- :disabled =" !isUpdated"
147+ :disabled =" !isUpdated || isSystem "
129148 class =" mr-5"
130149 @click =" $emit('save', role)"
131150 />
132151 <DsfrButton
133- v-if =" !role.isEveryone"
152+ v-if =" !role.isEveryone && !isSystem "
134153 data-testid =" deleteBtn"
135154 label =" Supprimer"
136155 secondary
0 commit comments