Skip to content

Commit

Permalink
chore: merge master into develop after 2.0.dev321 version tagging
Browse files Browse the repository at this point in the history
  • Loading branch information
@admin-cloudforet
admin-cloudforet committed Feb 22, 2025
2 parents aa1282e + 3cc2821 commit e5b97c1
Show file tree
Hide file tree
Showing 15 changed files with 184 additions and 145 deletions.
2 changes: 1 addition & 1 deletion apps/web/package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "web",
"version": "2.0.0-dev320",
"version": "2.0.0-dev321",
"private": true,
"description": "Cloudforet Console Web Application",
"author": "Cloudforet",
Expand Down
8 changes: 6 additions & 2 deletions apps/web/src/common/modules/widgets/_components/WidgetFormDataSourcePopover.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,8 @@ const dashboardDetailStore = useDashboardDetailInfoStore();
const dashboardDetailState = dashboardDetailStore.state;
const userStore = useUserStore();
const emit = defineEmits<{(e: 'scroll'): void;}>();
/* Query */
const {
dataTableList,
Expand Down Expand Up @@ -246,7 +248,7 @@ const handleClickDataSourceDomain = (domainName: DataTableSourceType) => {
state.selectedDataSourceDomain = domainName;
resetSelectedDataSource();
};
const handleCreateUnsavedTransform = (operator: DataTableOperator) => {
const handleCreateUnsavedTransform = async (operator: DataTableOperator) => {
const unsavedTransformData = {
data_table_id: `UNSAVED-${getRandomId()}`,
name: getDuplicatedDataTableName(`${operator} Data`, dataTableList.value),
Expand All @@ -260,13 +262,14 @@ const handleCreateUnsavedTransform = (operator: DataTableOperator) => {
const _isPrivate = widgetGenerateState.widgetId?.startsWith('private');
const dataTableListQueryKey = _isPrivate ? widgetQueryKeys.privateDataTableListQueryKey : widgetQueryKeys.publicDataTableListQueryKey;
queryClient.setQueryData(dataTableListQueryKey.value, (oldData: ListResponse<DataTableModel>) => (oldData.results?.length ? {
await queryClient.setQueryData(dataTableListQueryKey.value, (oldData: ListResponse<DataTableModel>) => (oldData.results?.length ? {
...oldData, results: [...oldData.results, unsavedTransformData],
} : {
...oldData, results: [unsavedTransformData],
}));
state.showPopover = false;
emit('scroll');
};
const handleSelectPopperCondition = (condition: DataTableDataType) => {
Expand Down Expand Up @@ -329,6 +332,7 @@ const handleConfirmDataSource = async () => {
...state.selectedDataSourceDomain === DATA_SOURCE_DOMAIN.COST ? costOptions : assetOptions,
},
});
emit('scroll');
}
widgetGenerateStore.setDataTableCreateLoading(false);
};
Expand Down
7 changes: 5 additions & 2 deletions apps/web/src/common/modules/widgets/_components/WidgetFormDataTableCard.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,15 @@ const LOADING_STATE = 'LOADING';
interface Props {
item?: PublicDataTableModel|PrivateDataTableModel;
loadingCard?: boolean;
loading?: boolean;
}
const props = defineProps<Props>();
const widgetGenerateStore = useWidgetGenerateStore();
const widgetGenerateState = widgetGenerateStore.state;
const addContents = ref<WidgetFormDataTableCardAddContents|null>(null);
const transformContents = ref<WidgetFormDataTableCardTransformContents|null>(null);
const addContents = ref<typeof WidgetFormDataTableCardAddContents|null>(null);
const transformContents = ref<typeof WidgetFormDataTableCardTransformContents|null>(null);
const state = reactive({
dataTableId: computed<string|undefined>(() => props.item?.data_table_id),
Expand Down Expand Up @@ -56,11 +57,13 @@ defineExpose({
ref="addContents"
:item="props.item"
:selected="state.selected"
:loading="props.loading"
/>
<widget-form-data-table-card-transform-contents v-else-if="state.dataType === DATA_TABLE_TYPE.TRANSFORMED"
ref="transformContents"
:item="props.item"
:selected="state.selected"
:loading="props.loading"
/>
</div>
</template>
Expand Down
32 changes: 15 additions & 17 deletions apps/web/src/common/modules/widgets/_components/WidgetFormDataTableCardAddContents.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@ import { useDashboardDetailInfoStore } from '@/services/dashboards/stores/dashbo
interface Props {
selected: boolean;
item: PublicDataTableModel|PrivateDataTableModel;
loading?: boolean;
}
type DataTableModel = PublicDataTableModel|PrivateDataTableModel;
Expand Down Expand Up @@ -246,7 +247,7 @@ const invalidateLoadQueries = async (data: DataTableModel) => {
],
});
};
const { mutateAsync: updateDataTableAndCascadeUpdate } = useMutation({
const { mutateAsync: updateDataTableMutation } = useMutation({
mutationFn: fetcher.updateDataTableFn,
onSuccess: async (data) => {
const dataTableListQueryKey = state.isPrivate ? keys.privateDataTableListQueryKey : keys.publicDataTableListQueryKey;
Expand All @@ -265,7 +266,6 @@ const { mutateAsync: updateDataTableAndCascadeUpdate } = useMutation({
return oldData;
});
await invalidateLoadQueries(data);
await cascadeUpdateDataTable(data.data_table_id);
setInitialDataTableForm();
state.filterFormKey = getRandomId();
Expand All @@ -284,6 +284,9 @@ const { mutateAsync: updateWidget } = useMutation({
? keys.privateWidgetQueryKey
: keys.publicWidgetQueryKey;
queryClient.setQueryData(widgetQueryKey.value, () => data);
showSuccessMessage(i18n.t('COMMON.WIDGETS.DATA_TABLE.FORM.UPDATE_DATA_TALBE_INVALID_SUCCESS'), '');
widgetGenerateStore.setSelectedDataTableId(state.dataTableId);
},
onError: (e) => {
showErrorMessage(e.message, e);
Expand Down Expand Up @@ -351,18 +354,7 @@ const updateDataTable = async (): Promise<DataTableModel|undefined> => {
timediff: getTimeDiffValue(),
},
};
const result = await updateDataTableAndCascadeUpdate(updateParams);
if (widget.value?.state === 'ACTIVE') {
const _widgetOptions = cloneDeep(widget.value.options);
const sanitizedOptions = sanitizeWidgetOptions(_widgetOptions, widget.value.widget_type, result);
await updateWidget({
widget_id: widgetGenerateState.widgetId,
state: 'INACTIVE',
options: sanitizedOptions,
});
}
return result;
return updateDataTableMutation(updateParams);
};
const deleteDataTableFn = (params: DataTableDeleteParameters): Promise<void> => {
if (params.data_table_id.startsWith('private')) {
Expand Down Expand Up @@ -447,8 +439,14 @@ const handleUpdateDataTable = async () => {
state.loading = true;
const result = await updateDataTable();
if (result) {
showSuccessMessage(i18n.t('COMMON.WIDGETS.DATA_TABLE.FORM.UPDATE_DATA_TALBE_INVALID_SUCCESS'), '');
widgetGenerateStore.setSelectedDataTableId(state.dataTableId);
const _widgetOptions = cloneDeep(widget.value?.options);
const sanitizedOptions = sanitizeWidgetOptions(_widgetOptions, widget.value?.widget_type, result);
await updateWidget({
widget_id: widgetGenerateState.widgetId,
state: 'INACTIVE',
options: sanitizedOptions,
});
await cascadeUpdateDataTable(result.data_table_id);
}
setTimeout(() => {
state.loading = false;
Expand Down Expand Up @@ -557,7 +555,7 @@ defineExpose({
/>
<widget-form-data-table-card-footer :disabled="validationState.dataTableApplyInvalid"
:changed="state.optionsChanged"
:loading="state.loading"
:loading="state.loading || props.loading"
@delete="handleClickDeleteDataTable"
@reset="handleClickResetDataTable"
@update="handleUpdateDataTable"
Expand Down
31 changes: 15 additions & 16 deletions apps/web/src/common/modules/widgets/_components/WidgetFormDataTableCardTransformContents.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ import { useDashboardDetailInfoStore } from '@/services/dashboards/stores/dashbo
interface Props {
selected: boolean;
item: PublicDataTableModel|PrivateDataTableModel;
loading?: boolean;
}
type DataTableModel = PublicDataTableModel|PrivateDataTableModel;
Expand Down Expand Up @@ -228,11 +229,10 @@ const invalidateLoadQueries = async (data: DataTableModel) => {
],
});
};
const { mutateAsync: updateDataTableAndCascadeUpdate } = useMutation({
const { mutateAsync: updateDataTableMutation } = useMutation({
mutationFn: fetcher.updateDataTableFn,
onSuccess: async (data) => {
await syncDataTableList(data);
await cascadeUpdateDataTable(data.data_table_id);
await invalidateLoadQueries(data);
setFailStatus(false);
Expand All @@ -250,6 +250,8 @@ const { mutateAsync: updateWidget } = useMutation({
? keys.privateWidgetQueryKey
: keys.publicWidgetQueryKey;
queryClient.setQueryData(widgetQueryKey.value, () => data);
showSuccessMessage(i18n.t('COMMON.WIDGETS.DATA_TABLE.FORM.UPDATE_DATA_TALBE_INVALID_SUCCESS'), '');
widgetGenerateStore.setSelectedDataTableId(state.dataTableId);
},
onError: (e) => {
showErrorMessage(e.message, e);
Expand Down Expand Up @@ -368,17 +370,8 @@ const updateDataTable = async (): Promise<DataTableModel|undefined> => {
name: state.dataTableName,
options: { [state.operator]: options() },
};
const result = await updateDataTableAndCascadeUpdate(updateParams);
if (widget.value?.state === 'ACTIVE') {
const _widgetOptions = cloneDeep(widget.value.options);
const sanitizedOptions = sanitizeWidgetOptions(_widgetOptions, widget.value.widget_type, result);
await updateWidget({
widget_id: widgetGenerateState.widgetId,
state: 'INACTIVE',
options: sanitizedOptions,
});
}
return result;
return updateDataTableMutation(updateParams);
};
const deleteDataTableFn = (params: DataTableDeleteParameters): Promise<void> => {
if (params.data_table_id.startsWith('private')) {
Expand Down Expand Up @@ -431,8 +424,14 @@ const handleUpdateDataTable = async () => {
state.loading = true;
const result = await updateDataTable();
if (result) {
showSuccessMessage(i18n.t('COMMON.WIDGETS.DATA_TABLE.FORM.UPDATE_DATA_TALBE_INVALID_SUCCESS'), '');
widgetGenerateStore.setSelectedDataTableId(result.data_table_id);
const _widgetOptions = cloneDeep(widget.value?.options);
const sanitizedOptions = sanitizeWidgetOptions(_widgetOptions, widget.value?.widget_type, result);
await updateWidget({
widget_id: widgetGenerateState.widgetId,
state: 'INACTIVE',
options: sanitizedOptions,
});
await cascadeUpdateDataTable(result.data_table_id);
}
setTimeout(() => {
state.loading = false;
Expand Down Expand Up @@ -560,7 +559,7 @@ defineExpose({
/>
<widget-form-data-table-card-footer :disabled="state.applyDisabled"
:changed="state.optionsChanged"
:loading="state.loading"
:loading="state.loading || props.loading"
@delete="handleClickDeleteDataTable"
@reset="handleClickResetDataTable"
@update="handleUpdateDataTable"
Expand Down
3 changes: 3 additions & 0 deletions apps/web/src/common/modules/widgets/_components/WidgetFormOverlay.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,9 @@ const handleClickContinue = async () => {
_updateParams.state = 'INACTIVE';
}
let widgetType = widget.value?.widget_type ?? 'table';
if (widgetGenerateState.selectedWidgetName) {
widgetType = widgetGenerateState.selectedWidgetName;
}
if (UNSUPPORTED_CHARTS_IN_PIVOT.includes(widgetType)) {
widgetType = 'table';
_updateParams.widget_type = widgetType;
Expand Down
46 changes: 35 additions & 11 deletions apps/web/src/common/modules/widgets/_components/WidgetFormOverlayStep1.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,10 @@ import WidgetFormDataSourcePopover from '@/common/modules/widgets/_components/Wi
import WidgetFormDataTableCard from '@/common/modules/widgets/_components/WidgetFormDataTableCard.vue';
import WidgetFormOverlayPreviewTable from '@/common/modules/widgets/_components/WidgetFormOverlayPreviewTable.vue';
import { useWidgetFormQuery } from '@/common/modules/widgets/_composables/use-widget-form-query';
import {
createDataTableReferenceMap,
getDataTableReferenceMapExecutionOrder,
} from '@/common/modules/widgets/_helpers/widget-data-table-helper';
import { useWidgetGenerateStore } from '@/common/modules/widgets/_store/widget-generate-store';
import { violet } from '@/styles/colors';
Expand All @@ -31,6 +35,7 @@ const widgetGenerateGetters = widgetGenerateStore.getters;
const dataTableContentsRef = ref<HTMLElement|null>(null);
const dataTableCardRef = ref<typeof WidgetFormDataTableCard[]>([]);
const scrollContainerRef = ref<HTMLElement|null>(null);
/* Query */
const {
Expand Down Expand Up @@ -64,25 +69,41 @@ const displayState = reactive({
resizing: false,
clientY: null,
transition: false,
loading: false,
});
/* Event */
const handleClickAllApply = async () => {
displayState.loading = true;
try {
dataTableCardRef.value.forEach((_ref) => {
if (_ref) {
if (typeof _ref?.updateDataTable === 'function') {
_ref?.updateDataTable();
}
}
});
const dataTableReferenceMap = createDataTableReferenceMap(dataTableList.value);
const executionOrderList = getDataTableReferenceMapExecutionOrder(dataTableReferenceMap);
const dataTableRefs = Object.fromEntries(
dataTableCardRef.value
.filter((_ref) => _ref)
.map((_ref) => [_ref.item?.data_table_id, _ref]),
);
await Promise.allSettled(
executionOrderList.map(async (dataTableId) => {
const dataTableRef = dataTableRefs[dataTableId];
if (dataTableRef) await dataTableRef.updateDataTable();
}),
);
showSuccessMessage(i18n.t('COMMON.WIDGETS.DATA_TABLE.APPLY_ALL_SUCCESS'), '');
} catch (e) {
ErrorHandler.handleError(e);
} finally {
displayState.loading = false;
}
};
const handleScrollDataTableContainer = () => {
if (!scrollContainerRef.value) return;
const { scrollWidth } = scrollContainerRef.value;
scrollContainerRef.value.scrollTo({ left: scrollWidth, behavior: 'smooth' });
};
/* Hide Toggle */
const offTransition = () => { displayState.transition = false; };
Expand Down Expand Up @@ -145,17 +166,20 @@ onMounted(async () => {
class="data-table-contents"
>
<div class="data-table-area">
<div class="data-table-scroll-wrapper">
<div ref="scrollContainerRef"
class="data-table-scroll-wrapper"
>
<div class="data-table-contents-wrapper">
<widget-form-data-table-card v-for="(dataTable, index) in displayState.dataTablesSortedByCreatedAt"
:ref="el => dataTableCardRef[index] = el"
:key="`data-table-${dataTable.data_table_id}`"
:item="dataTable"
:loading="displayState.loading"
/>
<widget-form-data-table-card v-if="widgetGenerateState.dataTableCreateLoading"
loading-card
/>
<widget-form-data-source-popover />
<widget-form-data-source-popover @scroll="handleScrollDataTableContainer" />
<div v-if="!dataTableList.length"
class="empty-data-table-guide"
>
Expand Down
Loading

0 comments on commit e5b97c1

Please sign in to comment.