Added edit mode UI improvements

[chaitali-mane]

🔩 Description: What code changed, and why?

Found some improvements in testing so some of them covered in this PR.

1. In Environment/ Databag/ Client/ Role details page update the CSS of tabs.
2. While creating the first Databag item I do not see the data bag item immediately.
3. Databag should be referred as "Data Bag" in the UI

⛓️ Related Resources

4873

1. In Environment/ Databag/ Client/ Role details page update the CSS of tabs.
2. While creating the first Databag item I do not see the data bag item immediately.
3. Databag should be referred as "Data Bag" in the UI

👍 Definition of Done

I have changes databags to "Data bags" in infra views and also updated CSS of tabs in details page.

👟 How to Build and Test the Change

STEP 1
inside the hab studio

[default:/src:0]# build components/automate-ui-devproxy/
[default:/src:0]# start_automate_ui_background
[default:/src:0]# start_all_services

STEP 2
open new window
go to automate UI path

$ cd components/automate-ui
and run the command

npm run serve:hab

navigate to https://a2-dev.test/infrastructure/chef-servers
Go to the infrastructure tab from the top navigation bar then you can see the Chef Infra Server -> Chef Organization
Where you can check the changes

✅ Checklist

All PRs must tick these:

• I have read the CONTRIBUTING document.
• All commits signed-off for the Developer Certification of Origin.

With occasional exceptions, all PRs from Progress employees must tick these:

• Is the code clear? (complicated code or lots of comments--subdivide and use well-named methods, meaningful variable names, etc.)
• Consistency checked? (user notifications, user prompts, visual patterns, code patterns, variable names)
• Repeated code blocks eliminated? (adapt and reuse existing components, blocks, functions, etc.)
• Spelling, grammar, typos checked? (at a minimum use make spell in any component directory)
• Code well-formatted? (indents, line breaks, etc. improve rather than hinder readability)

All PRs from Progress employees should tick these if appropriate:

• Tests added/updated? (all new code needs new tests)
• Docs added/updated? (all customer-facing changes)

Please add a note next to any checkbox above if you are NOT ticking it.

📷 Screenshots, if applicable

[netlify]

Deploy preview for chef-automate ready!

Built with commit a2ac78c

https://deploy-preview-4954--chef-automate.netlify.app

[vivekshankar1]

Thanks, @chaitali-mane , looks good to me

[vinay033]

@chaitali-mane
regarding
While creating the first Databag item I do not see the data bag item immediately.
I did not see any changes for this.

all other CSS changes are fine.

[vinay033]

LGTM 👍🏻