diff options
Diffstat (limited to 'app/assets/javascripts/organizations/index/components/organizations_view.vue')
-rw-r--r-- | app/assets/javascripts/organizations/index/components/organizations_view.vue | 52 |
1 files changed, 52 insertions, 0 deletions
diff --git a/app/assets/javascripts/organizations/index/components/organizations_view.vue b/app/assets/javascripts/organizations/index/components/organizations_view.vue new file mode 100644 index 00000000000..9720646bca3 --- /dev/null +++ b/app/assets/javascripts/organizations/index/components/organizations_view.vue @@ -0,0 +1,52 @@ +<script> +import { GlLoadingIcon, GlEmptyState } from '@gitlab/ui'; +import { s__ } from '~/locale'; +import OrganizationsList from './organizations_list.vue'; + +export default { + name: 'OrganizationsView', + i18n: { + emptyStateTitle: s__('Organization|Get started with organizations'), + emptyStateDescription: s__( + 'Organization|Create an organization to contain all of your groups and projects.', + ), + emptyStateButtonText: s__('Organization|New organization'), + }, + components: { + GlLoadingIcon, + OrganizationsList, + GlEmptyState, + }, + inject: ['newOrganizationUrl', 'organizationsEmptyStateSvgPath'], + props: { + organizations: { + type: Array, + required: false, + default: () => [], + }, + loading: { + type: Boolean, + required: false, + default: false, + }, + }, +}; +</script> + +<template> + <gl-loading-icon v-if="loading" class="gl-mt-5" size="md" /> + <organizations-list + v-else-if="organizations.length" + :organizations="organizations" + class="gl-border-t" + /> + <gl-empty-state + v-else + :svg-height="144" + :svg-path="organizationsEmptyStateSvgPath" + :title="$options.i18n.emptyStateTitle" + :description="$options.i18n.emptyStateDescription" + :primary-button-link="newOrganizationUrl" + :primary-button-text="$options.i18n.emptyStateButtonText" + /> +</template> |