Upgrade vue3 and all dependencies

Start the process of porting everything to Vue 3. I have most things
working. npm run-scripts build works, npm install works. prettier
passes. Styles load, logi

Upgrade vue3 and all dependencies

Start the process of porting everything to Vue 3. I have most things
working. npm run-scripts build works, npm install works. prettier
passes. Styles load, login works, webui loads.

This was primarily done using the linked documents below. It makes the
following design decisions:
1. Vue is put in compat 2 mode, which allows most of the components to
work as-is.
2. Bootstrap v4 is used along with bootstrap-vue to keep our components
working.
3. Minor changes are made to load the latest versions of vue-router,
vuex, and vue-i18n.

I suspect this patchset is good enough to start with, and we can clean
up the broken things one patchset at a time. The things that need to
happen are:

1. Get remaining features working again. This primiarily is vue-i18n
for mixins, and non vue components. This likely needs to be done by
not pulling in i18n into the non vue components, then using the .Vue
files to do the internationalization in the component context, NOT in
the mixin context. Alternatively, we could drop MixIns alltogether.
2. Get custom styles working again. Previously, we used some path
hackery in vue.config.js to optionally pre-load styles. This stops
working now that we're required to @import our modules. Likely we
need some rearangement of the paths such that custom styles are a
complete replacement (possibly importing the original) rather than
additive with overrides. That's a guess, but I don't really see
anyone else doing customization the way we've defined it here.
3. Bootstrap 5 no longer requires ANY custom vue modules, as it has
dropped the jquery dependency. We won't be able to pull in bootstrap
5 all at once, so pull in bootstrap 5 under an alias, like
"bootstrap5" that we can optionally import 5 or 4.
4. One at a time, start porting components over to Vue3 syntax and
bootstrap 5. This will be the bulk of the manual work and review.

The only thing I think left is getting unit tests passing, which I
commented out the pre-commit hook to make this PR.

Tested: Code builds. Needs better testing.

[1] https://router.vuejs.org/guide/migration/
[2] https://vue-i18n.intlify.dev/guide/migration/vue3
[3] https://vuelidate-next.netlify.app/migration_guide.html#package-name-and-imports

Change-Id: I5bb3187b9efbf2e4ff63e57994bc528756e2a981
Signed-off-by: Ed Tanous <ed@tanous.net>

show more ...

Reformat files with new linter

All changes should be whitespace, and were done using npm run-script
lint.

Change-Id: I943c6b435c5c872841af5affc1e89910468b5ca6
Signed-off-by: Ed Tanous <ed@tanous.ne

Reformat files with new linter

All changes should be whitespace, and were done using npm run-script
lint.

Change-Id: I943c6b435c5c872841af5affc1e89910468b5ca6
Signed-off-by: Ed Tanous <ed@tanous.net>

show more ...

Fix pre commit script break

There is no validation handle before checking the page title name
from the router. Which causes the pre-commit script to through error.
This patch set will handle this sc

Fix pre commit script break

There is no validation handle before checking the page title name
from the router. Which causes the pre-commit script to through error.
This patch set will handle this scenario and fix the break.

Change-Id: I5aed3bfeba643c2eb2b2753bf8f6d984b5100361
Signed-off-by: Kirankumar Ballapalli <kirankumarb@ami.com>

show more ...

Page heading do not translated on language change

Log in and log out of the application, change the language, and login
to the application. The heading and title are in the previous language
transla

Page heading do not translated on language change

Log in and log out of the application, change the language, and login
to the application. The heading and title are in the previous language
translation is handled in the router, and the languages are selected
after the router has rendered.The page title and heading translation
are handled after the language is selected.

Change-Id: Iba42fe3a535fe0b402f551c3f43e19d5ff12181d
Signed-off-by: Kirankumar Ballapalli <kirankumarb@ami.com>

show more ...

Update linting packages to use latest

- 99% of changes were small syntax changes that were changed by the
lint command. There were a couple of small manual changes to meet the
property order pattern

Update linting packages to use latest

- 99% of changes were small syntax changes that were changed by the
lint command. There were a couple of small manual changes to meet the
property order patterns established as part of the vue:recommended
guidelines.

There are rules that were set from errors to warnings and new stories
are being opened to address those issues.

Testing:
- Successfully ran npm run serve
- Successfully ran npm run lint
- Verified functionality works as expected, e.g. success and failure use cases
- Resolved any JavaScript errors thrown to the console

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ie082f31c73ccbe8a60afa8f88a9ef6dbf33d9fd2

show more ...

Move translation into routes file

- Added intial application load document title update with
created hook

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I73d18ed4a56bd04601f

Move translation into routes file

- Added intial application load document title update with
created hook

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I73d18ed4a56bd04601fa7382c2d6c2ec504b03f5

show more ...

Add ability to customize theme styles

Showcases how different themes/styles can be supported using
.env variables. If an environemnt name is specified during
the build process, an overrides file wil

Add ability to customize theme styles

Showcases how different themes/styles can be supported using
.env variables. If an environemnt name is specified during
the build process, an overrides file will be pulled in to
allow modifications to color and font definitions.

This commit includes possible style modifications with the openpower
env name as an example. To see the openpower changes, add the variable
definition VUE_APP_NAME="openpower" to your .env.development.local file
or build using 'npm run build -- --mode openpower'

- Moves helper imports into vue config to allow for
specific import order
- Removed helper imports in SFCs

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Iaf7a59c24fda06a7b74e23f2f042fb3300cb2056

show more ...

Update global typography

Updated the following body, label, and heading
styles to match new style guide:
- Font sizes
- Font weight
- Line height
- Color

Signed-off-by: Dixsie Wolmers <dixsie@ibm.c

Update global typography

Updated the following body, label, and heading
styles to match new style guide:
- Font sizes
- Font weight
- Line height
- Color

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I014c968f6542b697fec8c3b9af781e64ac10794d

show more ...

Update Sass architecture to require helper imports

- Restructuring file strucure to support single file components use of
Sass variables when imported into vuepress.
- Creating a scalable file struc

Update Sass architecture to require helper imports

- Restructuring file strucure to support single file components use of
Sass variables when imported into vuepress.
- Creating a scalable file structure using Sass best practices

Tested by building and testing both the vue web ui and the
the documentation application.

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Iddcefbf305c8dac978ee24e903df33b609e395e3

show more ...

Add Reboot BMC page

Created a ControlStore with the intention to consolidate actions
across multiple subnav pages under the 'Control' tab, instead of
creating a dedicated RebootBmc store with one ac

Add Reboot BMC page

Created a ControlStore with the intention to consolidate actions
across multiple subnav pages under the 'Control' tab, instead of
creating a dedicated RebootBmc store with one action.

- Update PageSection component to make sectionTitle prop optional
- Changed PageTitle computed property to data since the value
doesn't change during the component lifecycle
- Change PageSection <section> element to <div> to avoid
accessibility issues

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I2877e2a7b9bfee245c48d52c70859978b74be7f3

show more ...

Set up initial language translation

- Add i18n internationalization plugin
- Create json files for group 0 English and Spanish
- Uses $t method to set up initial translations on login page
- Meta ti

Set up initial language translation

- Add i18n internationalization plugin
- Create json files for group 0 English and Spanish
- Uses $t method to set up initial translations on login page
- Meta title is translated using i18n in App.vue and PageTitle.Vue

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ifce9f5e54d96f8b2a13239ad6178892f99fc4537

show more ...

Update PageTitle component to use div

Changed header element to div to fix accessiblity violation of
having multiple header elements without unique aria-label properties.

Signed-off-by: Yoshie Mura

Update PageTitle component to use div

Changed header element to div to fix accessiblity violation of
having multiple header elements without unique aria-label properties.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I1e8aeaa6ee9142e16176eb47928916424ef4fba0

show more ...

Change eslint rules to use vue recommended

Resubmitting after reverted–original commit here
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/28763/7

- Ran npm run lint
- Resolved eslint iss

Change eslint rules to use vue recommended

Resubmitting after reverted–original commit here
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/28763/7

- Ran npm run lint
- Resolved eslint issues

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I2b8b9244acddd483d0a72f9a5d156a79de9869a0

show more ...

Revert "Change eslint rules to use vue recommended"

Merged accidentally. Although this one did have the proper +1s/+2s.
The 2 underneath did not. The author will resubmit.

This reverts commit 5e7ac

Revert "Change eslint rules to use vue recommended"

Merged accidentally. Although this one did have the proper +1s/+2s.
The 2 underneath did not. The author will resubmit.

This reverts commit 5e7ac49058e5dc37fd43ecf3c0d06f5dda14af5b.

Change-Id: Iceb1de3a170cc0b592b183545c792aa3eb87bfee
Signed-off-by: Gunnar Mills <gmills@us.ibm.com>

show more ...

Change eslint rules to use vue recommended

- Ran npm run lint
- Resolved eslint issues

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Icd433ca55321d8bceb941e2d13ebade72bd4981f

Add page level layout components

Adding components to help standardize type, size, spacing
for common elements on a page.

Also removed a conflicting class name and added modifications
to the main c

Add page level layout components

Adding components to help standardize type, size, spacing
for common elements on a page.

Also removed a conflicting class name and added modifications
to the main container. The main container needed a min-height
and height value set, which became apparent with added
background color. Adding a background color will move us
closer to agreed design solution to add a subtle background
color instead of adding a border to separate main content from
left hand navigation.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ie63c4f0c0f3fd199fa0ca790065402e06a613691

show more ...