All files / app/assets/javascripts/jira_connect/subscriptions/components app.vue

100% Statements 16/16
83.33% Branches 5/6
100% Functions 6/6
100% Lines 16/16

Press n or j to go to the next uncovered block, b, p or k for the previous block.

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 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127  1x   1x 1x 1x 1x 1x 1x 1x 1x                                                   31x     24x     24x       24x             24x 24x           99x                                                                                                                                    
<script>
import { GlAlert, GlLink, GlSprintf, GlEmptyState } from '@gitlab/ui';
import { isEmpty } from 'lodash';
import { mapState, mapMutations } from 'vuex';
import { retrieveAlert } from '~/jira_connect/subscriptions/utils';
import { SET_ALERT } from '../store/mutation_types';
import SubscriptionsList from './subscriptions_list.vue';
import AddNamespaceButton from './add_namespace_button.vue';
import SignInButton from './sign_in_button.vue';
import UserLink from './user_link.vue';
import CompatibilityAlert from './compatibility_alert.vue';
 
export default {
  name: 'JiraConnectApp',
  components: {
    GlAlert,
    GlLink,
    GlSprintf,
    GlEmptyState,
    SubscriptionsList,
    AddNamespaceButton,
    SignInButton,
    UserLink,
    CompatibilityAlert,
  },
  inject: {
    usersPath: {
      default: '',
    },
    subscriptions: {
      default: [],
    },
  },
  computed: {
    ...mapState(['alert']),
    shouldShowAlert() {
      return Boolean(this.alert?.message);
    },
    hasSubscriptions() {
      return !isEmpty(this.subscriptions);
    },
    userSignedIn() {
      return Boolean(!this.usersPath);
    },
  },
  created() {
    this.setInitialAlert();
  },
  methods: {
    ...mapMutations({
      setAlert: SET_ALERT,
    }),
    setInitialAlert() {
      const { linkUrl, title, message, variant } = retrieveAlert() || {};
      this.setAlert({ linkUrl, title, message, variant });
    },
  },
};
</script>
 
<template>
  <div>
    <compatibility-alert />
 
    <gl-alert
      v-if="shouldShowAlert"
      class="gl-mb-7"
      :variant="alert.variant"
      :title="alert.title"
      data-testid="jira-connect-persisted-alert"
      @dismiss="setAlert"
    >
      <gl-sprintf v-if="alert.linkUrl" :message="alert.message">
        <template #link="{ content }">
          <gl-link :href="alert.linkUrl" target="_blank">{{ content }}</gl-link>
        </template>
      </gl-sprintf>
 
      <template v-else>
        {{ alert.message }}
      </template>
    </gl-alert>
 
    <user-link :user-signed-in="userSignedIn" :has-subscriptions="hasSubscriptions" />
 
    <h2 class="gl-text-center gl-mb-7">{{ s__('JiraService|GitLab for Jira Configuration') }}</h2>
    <div class="jira-connect-app-body gl-mx-auto gl-px-5 gl-mb-7">
      <template v-if="hasSubscriptions">
        <div class="gl-display-flex gl-justify-content-end">
          <sign-in-button v-if="!userSignedIn" :users-path="usersPath" />
          <add-namespace-button v-else />
        </div>
 
        <subscriptions-list />
      </template>
      <template v-else>
        <div v-if="!userSignedIn" class="gl-text-center">
          <p class="gl-mb-7">{{ s__('JiraService|Sign in to GitLab.com to get started.') }}</p>
          <sign-in-button class="gl-mb-7" :users-path="usersPath">
            {{ __('Sign in to GitLab') }}
          </sign-in-button>
          <p>
            {{
              s__(
                'Integrations|Note: this integration only works with accounts on GitLab.com (SaaS).',
              )
            }}
          </p>
        </div>
        <gl-empty-state
          v-else
          :title="s__('Integrations|No linked namespaces')"
          :description="
            s__(
              'Integrations|Namespaces are the GitLab groups and subgroups you link to this Jira instance.',
            )
          "
        >
          <template #actions>
            <add-namespace-button />
          </template>
        </gl-empty-state>
      </template>
    </div>
  </div>
</template>