web/satellite: migrate AllModals component to use SFC composition api

Change-Id: Id1271c0010035eb7a847c48c7eff9e59a81c25e5
This commit is contained in:
Vitalii 2023-03-29 14:58:43 +03:00 committed by Storj Robot
parent 8d15154fc6
commit 8d544ac3eb

View File

@ -7,72 +7,18 @@
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
<script setup lang="ts">
import { computed } from 'vue';
import CreateProjectPromptModal from '@/components/modals/CreateProjectPromptModal.vue';
import CreateProjectModal from '@/components/modals/CreateProjectModal.vue';
import NewCreateProjectModal from '@/components/modals/NewCreateProjectModal.vue';
import CreateBucketModal from '@/components/modals/CreateBucketModal.vue';
import AddPaymentMethodModal from '@/components/modals/AddPaymentMethodModal.vue';
import OpenBucketModal from '@/components/modals/OpenBucketModal.vue';
import MFARecoveryCodesModal from '@/components/modals/MFARecoveryCodesModal.vue';
import EnableMFAModal from '@/components/modals/EnableMFAModal.vue';
import DisableMFAModal from '@/components/modals/DisableMFAModal.vue';
import EditProfileModal from '@/components/modals/EditProfileModal.vue';
import ChangePasswordModal from '@/components/modals/ChangePasswordModal.vue';
import AddTeamMemberModal from '@/components/modals/AddTeamMemberModal.vue';
import AddTokenFundsModal from '@/components/modals/AddTokenFundsModal.vue';
import ShareBucketModal from '@/components/modals/ShareBucketModal.vue';
import ObjectDetailsModal from '@/components/modals/ObjectDetailsModal.vue';
import NewFolderModal from '@/components/modals/NewFolderModal.vue';
import ShareObjectModal from '@/components/modals/ShareObjectModal.vue';
import DeleteBucketModal from '@/components/modals/DeleteBucketModal.vue';
import AddCouponCodeModal from '@/components/modals/AddCouponCodeModal.vue';
import NewBillingAddCouponCodeModal from '@/components/modals/NewBillingAddCouponCodeModal.vue';
import CreateProjectPassphraseModal from '@/components/modals/createProjectPassphrase/CreateProjectPassphraseModal.vue';
import ManageProjectPassphraseModal from '@/components/modals/manageProjectPassphrase/ManageProjectPassphraseModal.vue';
import EnterPassphraseModal from '@/components/modals/EnterPassphraseModal.vue';
import PricingPlanModal from '@/components/modals/PricingPlanModal.vue';
import { useStore } from '@/utils/hooks';
// @vue/component
@Component({
components: {
EnterPassphraseModal,
ManageProjectPassphraseModal,
CreateProjectPassphraseModal,
DeleteBucketModal,
CreateProjectPromptModal,
CreateProjectModal,
NewCreateProjectModal,
CreateBucketModal,
AddPaymentMethodModal,
OpenBucketModal,
MFARecoveryCodesModal,
EnableMFAModal,
DisableMFAModal,
EditProfileModal,
ChangePasswordModal,
AddTeamMemberModal,
AddTokenFundsModal,
ShareBucketModal,
ShareObjectModal,
ObjectDetailsModal,
NewFolderModal,
AddCouponCodeModal,
NewBillingAddCouponCodeModal,
PricingPlanModal,
},
})
export default class AllModals extends Vue {
// TODO: add active modal indicator.
const store = useStore();
/**
* Indicates the current active modal.
*/
public get activeModal(): unknown | null {
// modal could be of VueConstructor type or Object (for composition api components).
return this.$store.state.appStateModule.viewsState.activeModal;
}
}
/**
* Indicates the current active modal.
*/
const activeModal = computed((): unknown | null => {
// modal could be of VueConstructor type or Object (for composition api components).
return store.state.appStateModule.viewsState.activeModal;
});
</script>