change some titles and make ui a bit more pretty i guess

src/api/types/user.ts

@@ -1,4 +1,5 @@
 export type UserType = {
+  username?: string;
   password?: string;
   token_bound_cidrs: string[];
   token_explicit_max_ttl: number;

src/translations/en.js

@@ -12,6 +12,7 @@ module.exports = {
 
   // Common buttons / placeholders
   common_new: "New",
+  common_view: "View",
   common_edit: "Edit",
   common_create: "Create",
   common_delete: "Delete",
@@ -265,6 +266,7 @@ module.exports = {
   auth_common_token_peroid: "Period (seconds)",
   auth_common_policies: "Policies",
   auth_common_type: "Token Type",
+  auth_common_token_config: "Token Config",
 
   // userpass Users List
   userpass_users_list_title: "Users List",

src/ui/pages/Access/Auth/AuthHome.tsx

@@ -14,9 +14,9 @@ export type AuthListElementProps = {
 };
 
 export function AuthListElement(props: AuthListElementProps): JSX.Element {
-  const isClickable = props.method.type != "token";
+  const isViewable = ["userpass"].includes(props.method.type);
 
-  const onHeaderLinkClick = async (props: AuthListElementProps) => {
+  const onViewClick = (props: AuthListElementProps) => {
     if (props.method.type == "userpass") {
       route(userPassUserListURL(props.path));
     }
@@ -24,15 +24,14 @@ export function AuthListElement(props: AuthListElementProps): JSX.Element {
 
   return (
     <div class="uk-padding-small uk-background-secondary">
-      {isClickable ? (
-        <a class="uk-h4 uk-margin-bottom" onClick={() => onHeaderLinkClick(props)}>
-          {props.path}
-        </a>
-      ) : (
       <span class="uk-h4 uk-margin-bottom">{props.path}</span>
-      )}
       <span class="uk-text-muted">{` (${props.method.accessor})`}</span>
       <div class="uk-margin-top">
+        {isViewable && (
+          <button class="uk-button uk-button-small uk-button-primary" onClick={() => {onViewClick(props)}}>
+            {i18next.t("common_view")}
+          </button>
+        )}
         <button
           class="uk-button uk-button-small uk-button-primary"
           onClick={async () => {

src/ui/pages/Access/Auth/userpass/UserPassUserEdit.tsx

@@ -31,19 +31,19 @@ export class UserPassUserEdit extends Component<DefaultPageProps, { user_data: U
       <>
         <PageTitle title={i18next.t("userpass_user_edit_title")} />
         <Form onSubmit={(data) => this.onSubmit(data)}>
+          <InputWithTitle title={i18next.t("common_password")}>
             <input
               class="uk-input uk-form-width-large"
               name="password"
               type="password"
               placeholder={i18next.t("common_password")}
             />
+          </InputWithTitle>
+
+          <br />
 
           <Margin>
-            <p>{i18next.t("auth_common_zero_default")}</p>
-          </Margin>
-
-          <Margin>
-            <p>{i18next.t("auth_common_generated_tokens")}</p>
+            <h4>{i18next.t("auth_common_token_config")}</h4>
           </Margin>
 
           <InputWithTitle title={i18next.t("common_cidrs")}>
@@ -139,6 +139,7 @@ export class UserPassUserEdit extends Component<DefaultPageProps, { user_data: U
     if (password.length > 0) {
       apiData.password = password;
     }
+
     try {
       await this.props.api.createOrUpdateUserPassUser(baseMount, user, apiData);
       route(userPassUserViewURL(baseMount, user));

src/ui/pages/Access/Auth/userpass/UserPassUserView.tsx

@@ -49,11 +49,7 @@ export class UserPassUserView extends Component<DefaultPageProps, { user_data: U
           </p>
 
           <Margin>
-            <p>{i18next.t("auth_common_zero_default")}</p>
-          </Margin>
-
-          <Margin>
-            <p>{i18next.t("auth_common_generated_tokens")}</p>
+            <h4>{i18next.t("auth_common_token_config")}</h4>
           </Margin>
 
           <table class="uk-table">