mirror of
https://github.com/directus/directus.git
synced 2026-01-27 04:08:09 -05:00
Simplify calendar layout's first day options (#16617)
* Simplify calendar layout's first day options * use type that is more technically accurate
This commit is contained in:
38
app/src/layouts/calendar/options.test.ts
Normal file
38
app/src/layouts/calendar/options.test.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { GlobalMountOptions } from '@vue/test-utils/dist/types';
|
||||
import { beforeAll, expect, test, vi } from 'vitest';
|
||||
import { createI18n, I18n } from 'vue-i18n';
|
||||
|
||||
import Options from './options.vue';
|
||||
|
||||
let i18n: I18n;
|
||||
let global: GlobalMountOptions;
|
||||
|
||||
beforeAll(() => {
|
||||
i18n = createI18n({
|
||||
legacy: false,
|
||||
});
|
||||
|
||||
// silences locale message not found warnings
|
||||
vi.spyOn(i18n.global, 't').mockImplementation((key: string) => key);
|
||||
|
||||
global = {
|
||||
stubs: ['v-field-template', 'v-select'],
|
||||
plugins: [i18n],
|
||||
};
|
||||
});
|
||||
|
||||
test('should have days array in firstDayOptions variable', async () => {
|
||||
const wrapper = mount(Options, {
|
||||
props: {
|
||||
collection: 'test',
|
||||
dateFields: ['test'],
|
||||
},
|
||||
shallow: true,
|
||||
global,
|
||||
});
|
||||
|
||||
const expected = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
|
||||
|
||||
expect(wrapper.vm.firstDayOptions.map((option: { text: string; value: number }) => option.text)).toEqual(expected);
|
||||
});
|
||||
@@ -29,7 +29,7 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { defineComponent, PropType, ref, onMounted } from 'vue';
|
||||
import { defineComponent, PropType } from 'vue';
|
||||
import { Field } from '@directus/shared/types';
|
||||
import { useSync } from '@directus/shared/composables';
|
||||
import { localizedFormat } from '@/utils/localized-format';
|
||||
@@ -72,17 +72,11 @@ export default defineComponent({
|
||||
const endDateFieldWritable = useSync(props, 'endDateField', emit);
|
||||
const firstDayWritable = useSync(props, 'firstDay', emit);
|
||||
|
||||
const firstDayOptions = ref<Record<string, any>[]>([]);
|
||||
|
||||
onMounted(async () => {
|
||||
const firstDayOfWeekForDate = startOfWeek(new Date());
|
||||
firstDayOptions.value = await Promise.all(
|
||||
[...Array(7).keys()].map(async (_, i) => ({
|
||||
text: localizedFormat(add(firstDayOfWeekForDate, { days: i }), 'EEEE'),
|
||||
value: i,
|
||||
}))
|
||||
);
|
||||
});
|
||||
const firstDayOfWeekForDate = startOfWeek(new Date());
|
||||
const firstDayOptions: { text: string; value: number }[] = [...Array(7).keys()].map((_, i) => ({
|
||||
text: localizedFormat(add(firstDayOfWeekForDate, { days: i }), 'EEEE'),
|
||||
value: i,
|
||||
}));
|
||||
|
||||
return { t, templateWritable, startDateFieldWritable, endDateFieldWritable, firstDayWritable, firstDayOptions };
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user