ui: Add copy button for Secret ID in Tokens list page

[kaxcode]

✨ Description:

Adds a copy button to each composite row in tokens list page, if Secret ID returns an actual ID.
Reuses the CopyButton component and some conditional logic to flag Secret ID returning an empty string or '<hidden>'.
Adds secretID as a common consul translation.

Note: The styling changes did not impact the other composite rows with actions.

Demo Link

📸 Screenshots:

⚡ Backend Changes:

Implemented in #10546.
In the backend, user permission are checked.
If the user has the correct permission then the SecretID attribute returns an actual ID.
If the user does not have the correct permissions '<hiddlen>' is returned.
It is rare but possible for SecretID to be an empty string. The endpoint would still return the attribute.

🤡 Updates to mock-api:

Updates made to /acl/tokens mock data.
Added SecretID attribute with 3 possible responses.
Updated the count of tokens and policies returned because it was making the composite row look very busy.

Busy composite row:

🧪 Testing:

No added tests. Simple conditional logic used and the CopyButton component has testing.

📌 Before merging:

• Changelog
• Demo Link

[gsusmi]

LGTM. Ty!

[ghost]

Recommend either changing the text, adding a title attribute, and/or adding an aria attribute that includes the verb for the action. This would better communicate to users what happens when they activate the button. For example, "Copy Secret ID".

[kaxcode]

Recommend either changing the text, adding a title attribute, and/or adding an aria attribute that includes the verb for the action. This would better communicate to users what happens when they activate the button. For example, "Copy Secret ID".

@randallmorey PR #10664 addresses this.

[hc-github-team-consul-core]

🍒 If backport labels were added before merging, cherry-picking will start automatically.

To retroactively trigger a backport after merging, add backport labels and re-run https://circleci.com/gh/hashicorp/consul/418982.