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