ui: fixes for console errors

[maryliag]

Fixes for problems causing warnings on console.
Those didn't cause any actual error, just warnings (but sending out as error on datadog):

• Change <p> to <span fixes Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.

• Change renderSuffix to suffix fixes React does not recognize the renderSuffix prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase rendersuffix instead.

• Add key attribute to list fixes Warning: Each child in a list should have a unique "key" prop.

• Adding checks that were causing some crashed the first time a page was open with no cache.
  Fixes error on reading transactionInsights #97902

Release note: None

[cockroach-teamcity]

This change is 

[maryliag]

bors r+

[craig]

Build succeeded:

• Bazel Essential CI (Cockroach)

[blathers-crl]

Encountered an error creating backports. Some common things that can go wrong:

1. The backport branch might have already existed.
2. There was a merge conflict.
3. The backport branch contained merge commits.

You might need to create your backport manually using the backport tool.

---

error creating merge commit from 4e1e936 to blathers/backport-release-22.2-98004: POST https://api.github.com/repos/cockroachdb/cockroach/merges: 409 Merge conflict []

you may need to manually resolve merge conflicts with the backport tool.

Backport to branch 22.2.x failed. See errors above.

---

_{🦉 Hoot! I am a Blathers, a bot for CockroachDB. My owner is dev-inf.}