Fix formatting

enso-org · May 7, 2024 · 16ade8f · 16ade8f
1 parent ac4ef24
commit 16ade8f
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 49 deletions.
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserGroupRow.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserGroupRow.tsx
@@ -59,21 +59,21 @@ export default function UserGroupRow(props: UserGroupRowProps) {
   return (
     <aria.Row
       id={userGroup.id}
-      className={`rounded-rows-child group h-row ${backend.isPlaceholderUserGroupId(userGroup.id) ? 'pointer-events-none placeholder' : ''}`}
+      className={`group h-row rounded-rows-child ${backend.isPlaceholderUserGroupId(userGroup.id) ? 'pointer-events-none placeholder' : ''}`}
       ref={contextMenuRef}
     >
       <aria.Cell className="text rounded-r-full border-x-2 border-transparent bg-clip-padding px-cell-x first:rounded-l-full last:border-r-0">
         <aria.TooltipTrigger>
           <FocusableText
             ref={tooltipTargetRef}
-            className="block cursor-[unset] overflow-hidden text-ellipsis whitespace-nowrap"
+            className="block cursor-default overflow-hidden text-ellipsis whitespace-nowrap"
           >
             {userGroup.groupName}
           </FocusableText>
           {needsTooltip && <ariaComponents.Tooltip>{userGroup.groupName}</ariaComponents.Tooltip>}
         </aria.TooltipTrigger>
       </aria.Cell>
-      <aria.Cell className="group-hover-2:opacity-100 relative bg-transparent p transparent">
+      <aria.Cell className="relative bg-transparent p transparent group-hover-2:opacity-100">
         <UnstyledButton
           onPress={() => {
             setModal(

diff --git a/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserGroupUserRow.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserGroupUserRow.tsx
@@ -1,40 +1,23 @@
-;
 /** @file A row of the user groups table representing a user. */
-import * as React from 'react';
+import * as React from 'react'
 
+import Cross2 from 'enso-assets/cross2.svg'
 
+import * as contextMenuHooks from '#/hooks/contextMenuHooks'
+import * as tooltipHooks from '#/hooks/tooltipHooks'
 
-import Cross2 from 'enso-assets/cross2.svg';
-
-
-
-import * as contextMenuHooks from '#/hooks/contextMenuHooks';
-import * as tooltipHooks from '#/hooks/tooltipHooks';
-
-
-
-import * as modalProvider from '#/providers/ModalProvider';
-import * as textProvider from '#/providers/TextProvider';
-
-
-
-import * as aria from '#/components/aria';
-import * as ariaComponents from '#/components/AriaComponents';
-import ContextMenuEntry from '#/components/ContextMenuEntry';
-import FocusableText from '#/components/FocusableText';
-import UnstyledButton from '#/components/UnstyledButton';
-
-
-
-import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal';
-
-
-
-import type * as backend from '#/services/Backend';
-
+import * as modalProvider from '#/providers/ModalProvider'
+import * as textProvider from '#/providers/TextProvider'
 
+import * as aria from '#/components/aria'
+import * as ariaComponents from '#/components/AriaComponents'
+import ContextMenuEntry from '#/components/ContextMenuEntry'
+import FocusableText from '#/components/FocusableText'
+import UnstyledButton from '#/components/UnstyledButton'
 
+import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
 
+import type * as backend from '#/services/Backend'
 
 // ========================
 // === UserGroupUserRow ===
@@ -84,17 +67,14 @@ export default function UserGroupUserRow(props: UserGroupUserRowProps) {
       className="group h-row rounded-rows-child"
       ref={contextMenuRef}
     >
-      <aria.Cell
-        ref={tooltipTargetRef}
-        className="text border-x-2 border-transparent bg-clip-padding rounded-rows-skip-level last:border-r-0"
-      >
+      <aria.Cell className="text border-x-2 border-transparent bg-clip-padding rounded-rows-skip-level last:border-r-0">
         <aria.TooltipTrigger>
-          <aria.Button className="ml-indent-1 flex h-row w-[calc(100%_-_var(--indent-1-size))] cursor-default items-center whitespace-nowrap rounded-full">
-            {/* NOTE: `overflow-hiden` brings back the ellipsis, but the tooltip disappears */}
-            <FocusableText className="grow text-ellipsis whitespace-nowrap px-name-column-x py-name-column-y text-left">
-              {user.name}
-            </FocusableText>
-          </aria.Button>
+          <FocusableText
+            ref={tooltipTargetRef}
+            className="ml-indent-1 block w-[calc(100%_-_var(--indent-1-size))] cursor-default items-center overflow-hidden text-ellipsis whitespace-nowrap rounded-full"
+          >
+            {user.name}
+          </FocusableText>
           {needsTooltip && <ariaComponents.Tooltip>{user.name}</ariaComponents.Tooltip>}
         </aria.TooltipTrigger>
       </aria.Cell>
@@ -122,4 +102,4 @@ export default function UserGroupUserRow(props: UserGroupUserRowProps) {
       </aria.Cell>
     </aria.Row>
   )
-}
+}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserRow.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/UserRow.tsx
@@ -67,15 +67,22 @@ export default function UserRow(props: UserRowProps) {
   return (
     <aria.Row
       id={user.userId}
-      className={`rounded-rows-child group h-row ${draggable ? 'cursor-grab' : ''}`}
+      className={`group h-row rounded-rows-child ${draggable ? 'cursor-grab' : ''}`}
       ref={contextMenuRef}
     >
-      <aria.Cell className="text overflow-hidden whitespace-nowrap border-x-2 border-transparent bg-clip-padding px-cell-x first:rounded-l-full last:rounded-r-full last:border-r-0 group-selected:bg-selected-frame">
-        {draggable && <aria.Button slot="drag" />}
+      <aria.Cell className="text relative overflow-hidden whitespace-nowrap border-x-2 border-transparent bg-clip-padding px-cell-x first:rounded-l-full last:rounded-r-full last:border-r-0 group-selected:bg-selected-frame">
+        {draggable && (
+          <aria.FocusRing>
+            <aria.Button
+              slot="drag"
+              className="absolute left top-1/2 ml-1 h-2 w-2 -translate-y-1/2 rounded-sm"
+            />
+          </aria.FocusRing>
+        )}
         <aria.TooltipTrigger>
           <FocusableText
             ref={tooltipTargetRef}
-            className="block cursor-[unset] overflow-hidden text-ellipsis whitespace-nowrap"
+            className="block cursor-default overflow-hidden text-ellipsis whitespace-nowrap"
           >
             {user.name}
           </FocusableText>
@@ -88,7 +95,7 @@ export default function UserRow(props: UserRowProps) {
       {doDeleteUserRaw == null ? null : doDeleteUser == null ? (
         <></>
       ) : (
-        <aria.Cell className="group-hover-2:opacity-100 relative bg-transparent p transparent">
+        <aria.Cell className="relative bg-transparent p transparent group-hover-2:opacity-100">
           <UnstyledButton
             onPress={event => {
               const rect = event.target.getBoundingClientRect()