diff options
Diffstat (limited to 'app/assets/javascripts/logs')
| -rw-r--r-- | app/assets/javascripts/logs/components/environment_logs.vue | 62 | ||||
| -rw-r--r-- | app/assets/javascripts/logs/components/log_simple_filters.vue | 42 |
2 files changed, 42 insertions, 62 deletions
diff --git a/app/assets/javascripts/logs/components/environment_logs.vue b/app/assets/javascripts/logs/components/environment_logs.vue index 97b96cb5839..f7c0bd5ae13 100644 --- a/app/assets/javascripts/logs/components/environment_logs.vue +++ b/app/assets/javascripts/logs/components/environment_logs.vue @@ -3,12 +3,11 @@ import { throttle } from 'lodash'; import { mapActions, mapState, mapGetters } from 'vuex'; import { GlSprintf, - GlIcon, GlAlert, - GlDeprecatedDropdown, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, - GlDeprecatedDropdownDivider, + GlDropdown, + GlDropdownSectionHeader, + GlDropdownItem, + GlDropdownDivider, GlInfiniteScroll, } from '@gitlab/ui'; @@ -23,12 +22,11 @@ import { formatDate } from '../utils'; export default { components: { GlSprintf, - GlIcon, GlAlert, - GlDeprecatedDropdown, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, - GlDeprecatedDropdownDivider, + GlDropdown, + GlDropdownSectionHeader, + GlDropdownItem, + GlDropdownDivider, GlInfiniteScroll, LogSimpleFilters, LogAdvancedFilters, @@ -174,46 +172,38 @@ export default { <div class="top-bar d-md-flex border bg-secondary-50 pt-2 pr-1 pb-0 pl-2"> <div class="flex-grow-0"> - <gl-deprecated-dropdown + <gl-dropdown id="environments-dropdown" :text="environments.current || managedApps.current" :disabled="environments.isLoading" - class="mb-2 gl-h-32 pr-2 d-flex d-md-block js-environments-dropdown" + class="gl-mr-3 gl-mb-3 gl-display-flex gl-display-md-block js-environments-dropdown" > - <gl-deprecated-dropdown-header class="gl-text-center"> + <gl-dropdown-section-header> {{ s__('Environments|Environments') }} - </gl-deprecated-dropdown-header> - <gl-deprecated-dropdown-item + </gl-dropdown-section-header> + <gl-dropdown-item v-for="env in environments.options" :key="env.id" + :is-check-item="true" + :is-checked="isCurrentEnvironment(env.name)" @click="showEnvironment(env.name)" > - <div class="d-flex"> - <gl-icon - :class="{ invisible: !isCurrentEnvironment(env.name) }" - name="status_success_borderless" - /> - <div class="gl-flex-grow-1">{{ env.name }}</div> - </div> - </gl-deprecated-dropdown-item> - <gl-deprecated-dropdown-divider /> - <gl-deprecated-dropdown-header class="gl-text-center"> + {{ env.name }} + </gl-dropdown-item> + <gl-dropdown-divider /> + <gl-dropdown-section-header> {{ s__('Environments|Managed apps') }} - </gl-deprecated-dropdown-header> - <gl-deprecated-dropdown-item + </gl-dropdown-section-header> + <gl-dropdown-item v-for="app in managedApps.options" :key="app.id" + :is-check-item="true" + :is-checked="isCurrentManagedApp(app.name)" @click="showManagedApp(app.name)" > - <div class="gl-display-flex"> - <gl-icon - :class="{ invisible: !isCurrentManagedApp(app.name) }" - name="status_success_borderless" - /> - <div class="gl-flex-grow-1">{{ app.name }}</div> - </div> - </gl-deprecated-dropdown-item> - </gl-deprecated-dropdown> + {{ app.name }} + </gl-dropdown-item> + </gl-dropdown> </div> <log-advanced-filters diff --git a/app/assets/javascripts/logs/components/log_simple_filters.vue b/app/assets/javascripts/logs/components/log_simple_filters.vue index 2e1270b5428..ba30d4628c9 100644 --- a/app/assets/javascripts/logs/components/log_simple_filters.vue +++ b/app/assets/javascripts/logs/components/log_simple_filters.vue @@ -1,19 +1,13 @@ <script> import { mapActions, mapState } from 'vuex'; -import { - GlIcon, - GlDeprecatedDropdown, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, -} from '@gitlab/ui'; +import { GlDropdown, GlDropdownSectionHeader, GlDropdownItem } from '@gitlab/ui'; import { s__ } from '~/locale'; export default { components: { - GlIcon, - GlDeprecatedDropdown, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, + GlDropdown, + GlDropdownSectionHeader, + GlDropdownItem, }, props: { disabled: { @@ -44,35 +38,31 @@ export default { </script> <template> <div> - <gl-deprecated-dropdown + <gl-dropdown ref="podsDropdown" :text="podDropdownText" :disabled="disabled" - class="mb-2 gl-h-32 pr-2 d-flex d-md-block flex-grow-0 qa-pods-dropdown" + class="gl-mr-3 gl-mb-3 gl-display-flex gl-display-md-block qa-pods-dropdown" > - <gl-deprecated-dropdown-header class="text-center"> + <gl-dropdown-section-header> {{ s__('Environments|Select pod') }} - </gl-deprecated-dropdown-header> + </gl-dropdown-section-header> - <gl-deprecated-dropdown-item v-if="!pods.options.length" disabled> + <gl-dropdown-item v-if="!pods.options.length" disabled> <span ref="noPodsMsg" class="text-muted"> {{ s__('Environments|No pods to display') }} </span> - </gl-deprecated-dropdown-item> - <gl-deprecated-dropdown-item + </gl-dropdown-item> + <gl-dropdown-item v-for="podName in pods.options" :key="podName" + :is-check-item="true" + :is-checked="isCurrentPod(podName)" class="text-nowrap" @click="showPodLogs(podName)" > - <div class="d-flex"> - <gl-icon - :class="{ invisible: !isCurrentPod(podName) }" - name="status_success_borderless" - /> - <div class="flex-grow-1">{{ podName }}</div> - </div> - </gl-deprecated-dropdown-item> - </gl-deprecated-dropdown> + {{ podName }} + </gl-dropdown-item> + </gl-dropdown> </div> </template> |