xref: /openbmc/webui-vue/src/main.js (revision fb6c6de9) 
1import Vue from 'vue';
2import App from './App.vue';
3import router from './router';
4
5//Do not change store import.
6//Exact match alias set to support
7//dotenv customizations.
8import store from './store';
9import eventBus from './eventBus';
10
11import {
12  AlertPlugin,
13  BadgePlugin,
14  ButtonPlugin,
15  BVConfigPlugin,
16  CardPlugin,
17  CollapsePlugin,
18  DropdownPlugin,
19  FormPlugin,
20  FormCheckboxPlugin,
21  FormDatepickerPlugin,
22  FormFilePlugin,
23  FormGroupPlugin,
24  FormInputPlugin,
25  FormRadioPlugin,
26  FormSelectPlugin,
27  FormTagsPlugin,
28  InputGroupPlugin,
29  LayoutPlugin,
30  LinkPlugin,
31  ListGroupPlugin,
32  ModalPlugin,
33  NavbarPlugin,
34  NavPlugin,
35  PaginationPlugin,
36  ProgressPlugin,
37  TablePlugin,
38  TabsPlugin,
39  ToastPlugin,
40  TooltipPlugin,
41} from 'bootstrap-vue';
42import Vuelidate from 'vuelidate';
43import i18n from './i18n';
44import { format } from 'date-fns-tz';
45
46// Filters
47Vue.filter('shortTimeZone', function (value) {
48  const longTZ = value
49    .toString()
50    .match(/\((.*)\)/)
51    .pop();
52  const regexNotUpper = /[*a-z ]/g;
53  return longTZ.replace(regexNotUpper, '');
54});
55
56Vue.filter('formatDate', function (value) {
57  const isUtcDisplay = store.getters['global/isUtcDisplay'];
58
59  if (value instanceof Date) {
60    if (isUtcDisplay) {
61      return value.toISOString().substring(0, 10);
62    }
63    const pattern = `yyyy-MM-dd`;
64    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
65    return format(value, pattern, { timezone });
66  }
67});
68
69Vue.filter('formatTime', function (value) {
70  const isUtcDisplay = store.getters['global/isUtcDisplay'];
71
72  if (value instanceof Date) {
73    if (isUtcDisplay) {
74      let timeOptions = {
75        timeZone: 'UTC',
76        hourCycle: 'h23',
77      };
78      return `${value.toLocaleTimeString('default', timeOptions)} UTC`;
79    }
80    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
81    const shortTz = Vue.filter('shortTimeZone')(value);
82    const pattern = `HH:mm:ss ('${shortTz}' O)`;
83    return format(value, pattern, { timezone }).replace('GMT', 'UTC');
84  }
85});
86
87// Plugins
88Vue.use(AlertPlugin);
89Vue.use(BadgePlugin);
90Vue.use(ButtonPlugin);
91Vue.use(BVConfigPlugin, {
92  BFormText: { textVariant: 'secondary' },
93  BTable: {
94    headVariant: 'light',
95    footVariant: 'light',
96  },
97  BFormTags: {
98    tagVariant: 'primary',
99    addButtonVariant: 'link-primary',
100  },
101  BBadge: {
102    variant: 'primary',
103  },
104});
105Vue.use(CardPlugin);
106Vue.use(CollapsePlugin);
107Vue.use(DropdownPlugin);
108Vue.use(FormPlugin);
109Vue.use(FormCheckboxPlugin);
110Vue.use(FormDatepickerPlugin);
111Vue.use(FormFilePlugin);
112Vue.use(FormGroupPlugin);
113Vue.use(FormInputPlugin);
114Vue.use(FormRadioPlugin);
115Vue.use(FormSelectPlugin);
116Vue.use(FormTagsPlugin);
117Vue.use(InputGroupPlugin);
118Vue.use(LayoutPlugin);
119Vue.use(LayoutPlugin);
120Vue.use(LinkPlugin);
121Vue.use(ListGroupPlugin);
122Vue.use(ModalPlugin);
123Vue.use(NavbarPlugin);
124Vue.use(NavPlugin);
125Vue.use(PaginationPlugin);
126Vue.use(ProgressPlugin);
127Vue.use(TablePlugin);
128Vue.use(TabsPlugin);
129Vue.use(ToastPlugin);
130Vue.use(TooltipPlugin);
131Vue.use(Vuelidate);
132
133new Vue({
134  router,
135  store,
136  i18n,
137  render: (h) => h(App),
138}).$mount('#app');
139Vue.prototype.$eventBus = eventBus;
140