Make ui_next the default UI #15347

fosterseth · 2024-07-09T17:22:14Z

How to test

download nodejs 18 https://nodejs.org/en/download/package-manager
checkout branch
locally (not in container), run make clean-ui ui-devel
start development environment with make docker-compose
navigate to https://localhost:8043/ and login. Should see new UI
install legacy UI by following these instructions https://github.com/ansible/awx/blob/ui_next_default/tools/docker-compose/README.md#install-legacy-ui
make sure legacy UI works

make target changes

New:
ui-legacy
ui-legacy-release
clean-ui-legacy

Changes (run these OUTSIDE awx containers, requires nodejs >= 18)
ui-devel - this now makes new UI
clean-ui - cleans new UI files

SUMMARY

Make the newer UI next the default UI experience.

Serves up old UI at /ui_legacy

pairs with ansible/awx-operator#1923

ISSUE TYPE

New or Enhanced Feature

COMPONENT NAME

API

TODO

remove welcome popup from ansible-ui
remove "tech preview" language from banner
make banner point to /ui_legacy/ instead of /

awx/ui/src/screens/Dashboard/Dashboard.js

samccann · 2024-07-16T20:09:54Z

Just a general comment - having links with 'here' as the text don't work well with screen-readers. It is better to have something more descriptive in that bit of text.

awx/main/views.py

AlanCoding · 2024-07-19T18:50:11Z

When I go to the dev environment I get this. What do I need to run the dev environment with the new UI?

AlanCoding · 2024-07-19T18:50:53Z

In the container I get:

bash-5.1$ make ui-next
make: Nothing to be done for 'ui-next'.

awx/settings/defaults.py

gundalow · 2024-07-19T18:49:56Z

awx/ui/src/screens/Dashboard/Dashboard.js

@@ -79,8 +77,8 @@ function Dashboard() {
        <Banner variant="info">
          <Trans>
            <p>
-              <InfoCircleIcon /> A tech preview of the new {brandName} user
-              interface can be found <a href="/ui_next">here</a>.
+              <InfoCircleIcon /> The new user interface can be found{' '}


Please don't use "here"
Maybe you the link should be "enable new user interface"

reworded it, see photo in opening body

awx/ui/src/screens/SubscriptionUsage/SubscriptionUsage.js

gundalow · 2024-07-19T18:53:06Z

When I go to the dev environment I get this. What do I need to run the dev environment with the new UI?

Do we need a check in the makefile to validate the UI is available, ie fail early.

AlanCoding · 2024-07-19T18:57:53Z

@gundalow I just want to know how to use this the first place. I read awx/ui_next/README.md (from hints in root Makefile) and set UI_NEXT_GIT_REPO to the git address for https://github.com/ansible/ansible-ui and the target still gives the same result.

fosterseth · 2024-07-19T19:35:32Z

to use

from awx repo run make ui-next (outside the container)
make docker-compose

Do we need a check in the makefile to validate the UI is available, ie fail early.
@gundalow

this isn't too different than how it was before, where users had to manually run make ui-devel after starting containers

gundalow · 2024-07-20T06:37:53Z

this isn't too different than how it was before, where users had to manually run make ui-devel after starting containers

Does this need to go into the contributing/devel docs somewhere?

Make the newer UI next the default UI experience. Enable legacy ui https://<controller_url>/ui_legacy will redirect to the old user interface Signed-off-by: Seth Foster <fosterbseth@gmail.com>

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

fosterseth · 2024-07-23T21:37:39Z

Does this need to go into the contributing/devel docs somewhere?
@gundalow

I added some documentation on installing the legacy UI

djyasin

I was able to pull down these changes and walk through the steps provided to successfully build ui_next and then the legacy UI with no issues.

instead of building the ui during make sdist build the ui ahead of time in different docker build stage

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

sonarcloud · 2024-07-25T16:54:32Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

fosterseth · 2024-07-26T19:37:31Z

no longer plan to serve old UI alongside new UI

closing in favor of #15405

github-actions bot added the component:api label Jul 9, 2024

fosterseth changed the title ~~Make ui_next default~~ Make ui_next the default UI Jul 9, 2024

github-actions bot added the component:ui label Jul 11, 2024

gundalow reviewed Jul 11, 2024

View reviewed changes

awx/ui/src/screens/Dashboard/Dashboard.js Outdated Show resolved Hide resolved

fosterseth requested a review from TheRealHaoLiu July 17, 2024 23:10

fosterseth force-pushed the ui_next_default branch from 5628c2c to 8b128d4 Compare July 18, 2024 15:31

fosterseth commented Jul 19, 2024

View reviewed changes

awx/main/views.py Outdated Show resolved Hide resolved

fosterseth force-pushed the ui_next_default branch 2 times, most recently from 4d03992 to ed5e9c7 Compare July 19, 2024 15:22

fosterseth mentioned this pull request Jul 19, 2024

Update link to old UI ansible/ansible-ui#2767

Closed

fosterseth force-pushed the ui_next_default branch from bebb513 to 716e5be Compare July 19, 2024 17:59

gundalow reviewed Jul 19, 2024

View reviewed changes

fosterseth added 9 commits July 22, 2024 12:15

Make ui_next default

8ea3254

Make the newer UI next the default UI experience. Enable legacy ui https://<controller_url>/ui_legacy will redirect to the old user interface Signed-off-by: Seth Foster <fosterbseth@gmail.com>

remove unused code

ad70302

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

return 404 if not enabled

1e916e6

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

prettier

4fef81c

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

remove UI_NEXT setting

e9147d3

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

lint

0e1898c

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

linter

db88b91

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

Remove UI_NEXT setting in UI src

9b70395

bump nodejs

83666af

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

fosterseth force-pushed the ui_next_default branch from 072fed8 to 83666af Compare July 22, 2024 17:05

touch up make commands

d0d0f55

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

djyasin self-requested a review July 24, 2024 13:25

djyasin approved these changes Jul 24, 2024

View reviewed changes

TheRealHaoLiu and others added 5 commits July 24, 2024 14:59

multi-stage build

18faf4b

instead of building the ui during make sdist build the ui ahead of time in different docker build stage

build ui outside of container

deedd41

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

add ui legacy to misc edit

e07be7b

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

add ui_legacy entries in settings

7d3eec2

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

remove node_version

970dbb6

Signed-off-by: Seth Foster <fosterbseth@gmail.com>

fosterseth closed this Jul 26, 2024

fosterseth deleted the ui_next_default branch August 1, 2024 21:09

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Make ui_next the default UI #15347

Make ui_next the default UI #15347

fosterseth commented Jul 9, 2024 •

edited

Loading

samccann commented Jul 16, 2024

AlanCoding commented Jul 19, 2024

AlanCoding commented Jul 19, 2024

gundalow Jul 19, 2024

fosterseth Jul 19, 2024

gundalow commented Jul 19, 2024

AlanCoding commented Jul 19, 2024

fosterseth commented Jul 19, 2024 •

edited

Loading

gundalow commented Jul 20, 2024

fosterseth commented Jul 23, 2024

djyasin left a comment

sonarcloud bot commented Jul 25, 2024

fosterseth commented Jul 26, 2024

Make ui_next the default UI #15347

Make ui_next the default UI #15347

Conversation

fosterseth commented Jul 9, 2024 • edited Loading

How to test

make target changes

SUMMARY

ISSUE TYPE

COMPONENT NAME

TODO

samccann commented Jul 16, 2024

AlanCoding commented Jul 19, 2024

AlanCoding commented Jul 19, 2024

gundalow Jul 19, 2024

Choose a reason for hiding this comment

fosterseth Jul 19, 2024

Choose a reason for hiding this comment

gundalow commented Jul 19, 2024

AlanCoding commented Jul 19, 2024

fosterseth commented Jul 19, 2024 • edited Loading

gundalow commented Jul 20, 2024

fosterseth commented Jul 23, 2024

djyasin left a comment

Choose a reason for hiding this comment

sonarcloud bot commented Jul 25, 2024

Quality Gate passed

fosterseth commented Jul 26, 2024

fosterseth commented Jul 9, 2024 •

edited

Loading

fosterseth commented Jul 19, 2024 •

edited

Loading