Skip to content

Commit

Permalink
Fix danger zones misplaced (#206)
Browse files Browse the repository at this point in the history 
Co-authored-by: Thibaud Dauce <[email protected]>
Co-authored-by: Thibaud Dauce <[email protected]>
  • Loading branch information
@nicolaskempf57 @ThibaudDauce
3 people authored Dec 16, 2024
1 parent 9863384 commit e9342aa
Show file tree
Hide file tree
Showing 13 changed files with 203 additions and 244 deletions.
15 changes: 0 additions & 15 deletions components/AdminDangerZone/AdminDangerZone.vue
View file

This file was deleted.

91 changes: 44 additions & 47 deletions components/Dataservices/AdminUpdateDataservicePage.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,58 +6,55 @@
type="update"
@submit="save"
>
<button
type="submit"
class="fr-btn"
:disabled="loading"
>
{{ t("Save") }}
</button>
</DescribeDataservice>
<AdminDangerZone
class="mt-5"
>
<div class="fr-col">
<p class="fr-m-0 text-neutral-800">
{{ $t('Delete the dataservice') }}
</p>
<p class="fr-m-0 fr-text--xs text-red-600">
{{ $t("Be careful, this action can't be reverse.") }}
</p>
</div>
<div class="fr-col-auto">
<ModalWithButton
:title="$t('Are you sure you want to delete this dataservice ?')"
size="lg"
<template #button>
<button
type="submit"
class="fr-btn"
:disabled="loading"
>
<template #button="{ attrs, listeners }">
<BrandedButton
color="danger"
size="xs"
:icon="RiDeleteBin6Line"
v-bind="attrs"
v-on="listeners"
>
{{ $t('Delete') }}
</BrandedButton>
</template>
<p class="fr-text--bold">
{{ $t("This action can't be reverse.") }}
</p>
<template #footer>
<div class="flex-1 fr-btns-group fr-btns-group--right fr-btns-group--inline-reverse fr-btns-group--inline-lg fr-btns-group--icon-left">
{{ t("Save") }}
</button>
</template>
<BannerAction
class="mt-5"
type="danger"
:title="$t('Delete the dataservice')"
>
{{ $t("Be careful, this action can't be reverse.") }}
<template #button>
<ModalWithButton
:title="$t('Are you sure you want to delete this dataservice ?')"
size="lg"
>
<template #button="{ attrs, listeners }">
<BrandedButton
color="danger"
:disabled="loading"
@click="deleteDataservice"
size="xs"
:icon="RiDeleteBin6Line"
v-bind="attrs"
v-on="listeners"
>
{{ $t("Delete the dataservice") }}
{{ $t('Delete') }}
</BrandedButton>
</div>
</template>
</ModalWithButton>
</div>
</AdminDangerZone>
</template>
<p class="fr-text--bold">
{{ $t("This action can't be reverse.") }}
</p>
<template #footer>
<div class="flex-1 fr-btns-group fr-btns-group--right fr-btns-group--inline-reverse fr-btns-group--inline-lg fr-btns-group--icon-left">
<BrandedButton
color="danger"
:disabled="loading"
@click="deleteDataservice"
>
{{ $t("Delete the dataservice") }}
</BrandedButton>
</div>
</template>
</ModalWithButton>
</template>
</BannerAction>
</DescribeDataservice>
</div>
</template>

Expand Down
61 changes: 26 additions & 35 deletions components/Dataservices/DescribeDataservice.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -424,44 +424,35 @@
:error-text="getFirstError('business_documentation_url')"
/>
</LinkedToAccordion>
<fieldset
v-if="type === 'update'"
class="fr-fieldset__element"
>
<fieldset
id="checkboxes-hint-el-sm"
class="fr-fieldset"
aria-labelledby="checkboxes-hint-el-sm-legend checkboxes-hint-el-sm-messages"
>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group fr-checkbox-group--sm">
<input
id="checkboxes-hint-el-sm-1"
v-model="dataserviceForm.private"
name="checkboxes-hint-el-sm-1"
type="checkbox"
aria-describedby="checkboxes-hint-el-sm-1-messages"
>
<label
class="fr-label"
for="checkboxes-hint-el-sm-1"
>
{{ t('Switch to draft mode') }}
<span class="fr-hint-text">{{ t('The dataservice will only be visible to members of your organization.') }}</span>
</label>
<div
id="checkboxes-hint-el-sm-1-messages"
class="fr-messages-group"
aria-live="assertive"
/>
</div>
</div>
</fieldset>
</fieldset>
</fieldset>
<div
v-if="type === 'update'"
class="fr-checkbox-group fr-checkbox-group--sm mb-4"
>
<input
id="checkboxes-hint-el-sm-1"
v-model="dataserviceForm.private"
name="checkboxes-hint-el-sm-1"
type="checkbox"
aria-describedby="checkboxes-hint-el-sm-1-messages"
>
<label
class="fr-label"
for="checkboxes-hint-el-sm-1"
>
{{ t('Switch to draft mode') }}
<span class="fr-hint-text">{{ t('The dataservice will only be visible to members of your organization.') }}</span>
</label>
<div
id="checkboxes-hint-el-sm-1-messages"
class="fr-messages-group"
aria-live="assertive"
/>
</div>
<div class="fr-grid-row fr-grid-row--right">
<slot />
<slot name="button" />
</div>
<slot />
</div>
</form>
</div>
Expand Down
87 changes: 44 additions & 43 deletions components/Datasets/AdminUpdateDatasetPage.vue
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,58 @@
<template>
<div class="space-y-5">
<div>
<DescribeDataset
v-if="datasetForm"
v-model="datasetForm"
type="update"
:submit-label="t('Save')"
@submit="save"
/>

<TransferBanner
type="Dataset"
:subject="dataset"
:label="$t('Transfer dataset')"
/>

<BannerAction
class="w-7/12"
type="danger"
:title="$t('Delete the dataset')"
>
{{ $t("Be careful, this action can't be reverse.") }}

<template #button>
<ModalWithButton
:title="$t('Are you sure you want to delete this dataset ?')"
size="lg"
<div class="mt-5 space-y-5">
<TransferBanner
type="Dataset"
:subject="dataset"
:label="$t('Transfer dataset')"
/>

<BannerAction
type="danger"
:title="$t('Delete the dataset')"
>
<template #button="{ attrs, listeners }">
<BannerActionButton
:icon="RiDeleteBin6Line"
v-bind="attrs"
v-on="listeners"
{{ $t("Be careful, this action can't be reverse.") }}

<template #button>
<ModalWithButton
:title="$t('Are you sure you want to delete this dataset ?')"
size="lg"
>
{{ $t('Delete') }}
</BannerActionButton>
</template>
<p class="fr-text--bold">
{{ $t("This action can't be reverse.") }}
</p>
<template #footer>
<div class="flex-1 fr-btns-group fr-btns-group--right fr-btns-group--inline-reverse fr-btns-group--inline-lg fr-btns-group--icon-left">
<BrandedButton
color="danger"
:disabled="loading"
@click="deleteDataset"
>
{{ $t("Delete the dataset") }}
</BrandedButton>
</div>
<template #button="{ attrs, listeners }">
<BannerActionButton
:icon="RiDeleteBin6Line"
v-bind="attrs"
v-on="listeners"
>
{{ $t('Delete') }}
</BannerActionButton>
</template>
<p class="fr-text--bold">
{{ $t("This action can't be reverse.") }}
</p>
<template #footer>
<div class="flex-1 fr-btns-group fr-btns-group--right fr-btns-group--inline-reverse fr-btns-group--inline-lg fr-btns-group--icon-left">
<BrandedButton
color="danger"
:disabled="loading"
@click="deleteDataset"
>
{{ $t("Delete the dataset") }}
</BrandedButton>
</div>
</template>
</ModalWithButton>
</template>
</ModalWithButton>
</template>
</BannerAction>
</BannerAction>
</div>
</DescribeDataset>
</div>
</template>

Expand Down
5 changes: 3 additions & 2 deletions components/Datasets/DescribeDataset.vue
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="fr-grid-row">
<Sidemenu
class="fr-col-12 fr-col-md-5"
class="fr-col-12 fr-col-lg-5"
:button-text="$t('Help')"
:on-right="true"
:fixed="true"
Expand Down Expand Up @@ -151,7 +151,7 @@
</Accordion>
</AccordionGroup>
</Sidemenu>
<div class="fr-col-12 fr-col-md-7">
<div class="fr-col-12 fr-col-lg-7">
<div class="fr-p-3w bg-white">
<Well
v-if="type === 'create'"
Expand Down Expand Up @@ -508,6 +508,7 @@
{{ submitLabel }}
</BrandedButton>
</div>
<slot />
</div>
</div>
</div>
Expand Down
Loading

0 comments on commit e9342aa

Please sign in to comment.