1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
|
<!--
- SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
- SPDX-License-Identifier: AGPL-3.0-or-later
-->
<script setup lang="ts">
import type { IDialogButton } from '@nextcloud/dialogs'
import { t } from '@nextcloud/l10n'
import { computed, ref } from 'vue'
import { useUserConfigStore } from '../store/userconfig.ts'
import NcCheckboxRadioSwitch from '@nextcloud/vue/components/NcCheckboxRadioSwitch'
import NcDialog from '@nextcloud/vue/components/NcDialog'
import svgIconCancel from '@mdi/svg/svg/cancel.svg?raw'
import svgIconCheck from '@mdi/svg/svg/check.svg?raw'
const props = defineProps<{
oldExtension?: string
newExtension?: string
}>()
const emit = defineEmits<{
(e: 'close', v: boolean): void
}>()
const userConfigStore = useUserConfigStore()
const dontShowAgain = computed({
get: () => !userConfigStore.userConfig.show_dialog_file_extension,
set: (value: boolean) => userConfigStore.update('show_dialog_file_extension', !value),
})
const buttons = computed<IDialogButton[]>(() => [
{
label: props.oldExtension
? t('files', 'Keep {old}', { old: props.oldExtension })
: t('files', 'Keep without extension'),
icon: svgIconCancel,
type: 'secondary',
callback: () => closeDialog(false),
},
{
label: props.newExtension
? t('files', 'Use {new}', { new: props.newExtension })
: t('files', 'Remove extension'),
icon: svgIconCheck,
type: 'primary',
callback: () => closeDialog(true),
},
])
/** Open state of the dialog */
const open = ref(true)
/**
* Close the dialog and emit the response
* @param value User selected response
*/
function closeDialog(value: boolean) {
emit('close', value)
open.value = false
}
</script>
<template>
<NcDialog :buttons="buttons"
:open="open"
:can-close="false"
:name="t('files', 'Change file extension')"
size="small">
<p v-if="newExtension && oldExtension">
{{ t('files', 'Changing the file extension from "{old}" to "{new}" may render the file unreadable.', { old: oldExtension, new: newExtension }) }}
</p>
<p v-else-if="oldExtension">
{{ t('files', 'Removing the file extension "{old}" may render the file unreadable.', { old: oldExtension }) }}
</p>
<p v-else-if="newExtension">
{{ t('files', 'Adding the file extension "{new}" may render the file unreadable.', { new: newExtension }) }}
</p>
<NcCheckboxRadioSwitch v-model="dontShowAgain"
class="dialog-confirm-file-extension__checkbox"
type="checkbox">
{{ t('files', 'Do not show this dialog again.') }}
</NcCheckboxRadioSwitch>
</NcDialog>
</template>
<style scoped>
.dialog-confirm-file-extension__checkbox {
margin-top: 1rem;
}
</style>
|