Skip to content

Commit

Permalink
Fix for unclickable account avatar on windows
Browse files Browse the repository at this point in the history
  • Loading branch information
hex#gitlab@telios.io committed Jan 9, 2023
1 parent 7dd183a commit 6407d80
Show file tree
Hide file tree
Showing 3 changed files with 26 additions and 39 deletions.
6 changes: 3 additions & 3 deletions app/main_window/components/Layout/TopBar/GlobalTopBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import WindowControls from '../../../../global_components/WindowControls/WindowC
import UserMenu from './UserMenu';
import styles from './GlobalTopBar.css';

type Props = {
type Props = {
onSelect: (eventKey: string) => void;
};

Expand All @@ -22,10 +22,10 @@ const GlobalTopBar = (props: Props) => {
<div
className={`grow-0 flex flex-row items-center h-full w-1/3 ${styles.avatar} ${styles.draggable} justify-end`}
>
<div className='px-3'>
<div className='px-3 select-none' style={{ WebkitAppRegion: 'no-drag', display: 'block' }}>
<UserMenu onSelect={onSelect} />
</div>

<WindowControls />
</div>
</header>
Expand Down
38 changes: 19 additions & 19 deletions app/main_window/components/Layout/TopBar/UserMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -145,35 +145,35 @@ const UserMenu = (props: Props) => {

return (
<>
<Menu as="div" className="relative">
<Menu as="div" className="relative select-none">
{({ open }) => (
<>
<div
ref={setTargetElement}
className="rounded-full shadow border border-gray-400/70 z-50 relative"
className="rounded-full shadow border border-gray-400/70 z-50 relative select-none"
style={{ cursor: 'pointer' }}
>
<Menu.Button
className={`max-w-xs flex items-center rounded-full text-sm focus:outline-none relative${
className={`max-w-xs flex items-center rounded-full text-sm focus:outline-none select-none relative${
open ? 'ring-2 ring-offset-2 ring-blue-300' : ''
} `}
>
<span className="sr-only">Open user menu</span>
<span className="sr-only select-none">Open user menu</span>
{hasAvatar && (
<img
className="h-7 w-7 rounded-full"
className="h-7 w-7 rounded-full select-none"
src={account.avatar}
alt=""
/>
)}
{!hasAvatar && (
<span
className="inline-flex h-7 w-7 items-center justify-center rounded-full"
className="inline-flex h-7 w-7 items-center justify-center rounded-full select-none"
style={{
backgroundColor: stringToHslColor(displayAddress, 50, 50)
}}
>
<span className="text-sm font-medium leading-none text-white uppercase">
<span className="text-sm font-medium leading-none text-white uppercase select-none">
{displayAddress.substring(0, 1)}
</span>
</span>
Expand Down Expand Up @@ -207,14 +207,14 @@ const UserMenu = (props: Props) => {
<div className="border border-gray-300 rounded-full">
{hasAvatar && (
<img
className="h-9 w-9 rounded-full"
className="h-9 w-9 rounded-full select-none"
src={account.avatar}
alt=""
/>
)}
{!hasAvatar && (
<div
className="inline-flex h-9 w-9 rounded-full items-center justify-center"
className="inline-flex h-9 w-9 rounded-full items-center justify-center select-none"
style={{
backgroundColor: stringToHslColor(
displayAddress,
Expand All @@ -231,33 +231,33 @@ const UserMenu = (props: Props) => {
</div>

<div className="pl-3 flex flex-col overflow-hidden max-w-[215px]">
<div className="text-sm leading-5 font-semibold overflow-ellipsis overflow-x-hidden">
<div className="text-sm leading-5 font-semibold overflow-ellipsis overflow-x-hidden select-none">
{mailbox?.displayName?.length > 0
? mailbox?.displayName
: mailbox?.address}
</div>
{mailbox?.displayName?.length > 0 && (
<div className="text-xs leading-5 font-normal text-gray-500 overflow-ellipsis overflow-x-hidden">
<div className="text-xs leading-5 font-normal text-gray-500 overflow-ellipsis select-none overflow-x-hidden">
{mailbox?.address}
</div>
)}
</div>
</div>
<Menu.Item>
<div
className="w-full pt-3 text-center"
className="w-full pt-3 text-center select-none"
style={{ cursor: 'pointer' }}
onClick={() => onSelect('settings')}
>
<div className="text-xs rounded border border-gray-300 py-1 text-gray-500 hover:bg-gray-100">
<div className="text-xs rounded border border-gray-300 py-1 text-gray-500 hover:bg-gray-100 select-none">
Account Settings
</div>
</div>
</Menu.Item>
</div>
{switcherData.filter(m => m.address !== mailbox?.address)
.length > 0 && (
<div className="py-1 max-h-[300px] overflow-y-scroll">
<div className="py-1 max-h-[300px] overflow-y-scroll select-none">
{switcherData
.filter(m => m.address !== mailbox?.address)
.map(m => (
Expand All @@ -274,7 +274,7 @@ const UserMenu = (props: Props) => {
: 'text-gray-700'
} flex flex-row items-center w-full px-4 py-2 text-sm leading-5 text-left`}
>
<div className="border border-gray-300 rounded-full">
<div className="border border-gray-300 rounded-full select-none">
{m.avatar && (
<img
className="h-7 w-7 rounded-full"
Expand Down Expand Up @@ -326,7 +326,7 @@ const UserMenu = (props: Props) => {
active
? 'bg-gray-100 text-gray-900'
: 'text-gray-700'
} flex items-center justify-between w-full px-4 py-2 text-sm leading-5 text-left hover:no-underline font-normal`}
} flex select-none items-center justify-between w-full px-4 py-2 text-sm leading-5 text-left hover:no-underline font-normal`}
>
<span>Release Notes</span>
</a>
Expand All @@ -343,7 +343,7 @@ const UserMenu = (props: Props) => {
active
? 'bg-gray-100 text-gray-900'
: 'text-gray-700'
} flex items-center justify-between w-full px-4 py-2 text-sm leading-5 text-left hover:no-underline font-normal`}
} flex items-center select-none justify-between w-full px-4 py-2 text-sm leading-5 text-left hover:no-underline font-normal`}
>
<span>Support</span>
</a>
Expand All @@ -358,7 +358,7 @@ const UserMenu = (props: Props) => {
style={{ cursor: 'pointer' }}
className={`${
active ? 'text-red-500' : 'text-gray-700'
} flex w-full px-4 py-2 text-sm leading-5 text-left items-center font-medium`}
} flex w-full px-4 py-2 text-sm select-none leading-5 text-left items-center font-medium`}
>
<Logout
set="broken"
Expand All @@ -369,7 +369,7 @@ const UserMenu = (props: Props) => {
</div>
)}
</Menu.Item>
<div className="text-xs px-4 text-gray-400 pb-2 pt-1 w-full flex flex-row justify-center items-center font-medium">
<div className="text-xs px-4 text-gray-400 pb-2 select-none pt-1 w-full flex flex-row justify-center items-center font-medium">
{`v${pkg.version}`}
{' '}
<span className="h-1 w-1 rounded-full bg-gray-400 mx-2" />
Expand Down
21 changes: 4 additions & 17 deletions app/yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,9 +148,9 @@
rimraf "^3.0.2"
uuid "^8.2.0"

"@telios/nebula-migrate@git+https://github.com/Telios-org/nebula-migrate.git":
"@telios/nebula-migrate@git+https://github.com/Telios-org/nebula-migrate":
version "3.0.6"
resolved "git+https://github.com/Telios-org/nebula-migrate.git#de58a5cc0d330ac8b555e01e0599348facd609f9"
resolved "git+https://github.com/Telios-org/nebula-migrate#de58a5cc0d330ac8b555e01e0599348facd609f9"
dependencies:
"@telios/nebula-old" "git+https://github.com/Telios-org/nebula#v3.4.14"
luxon "^3.1.1"
Expand Down Expand Up @@ -208,9 +208,9 @@
stopwords "^0.0.9"
uuid "^8.2.0"

"@telios/nebula@git+https://github.com/Telios-org/nebula.git":
"@telios/nebula@git+https://github.com/Telios-org/nebula":
version "4.0.11"
resolved "git+https://github.com/Telios-org/nebula.git#5d633a77358fbedb6a18723b98871bbffc7a77ef"
resolved "git+https://github.com/Telios-org/nebula#5d633a77358fbedb6a18723b98871bbffc7a77ef"
dependencies:
autobase "https://github.com/hypercore-protocol/autobase"
bip39 "^3.0.4"
Expand Down Expand Up @@ -387,21 +387,8 @@ autobase@1.0.0-alpha.6:
safety-catch "^1.0.1"
streamx "^2.10.0"

"autobase@git+https://github.com/hypercore-protocol/autobase.git":
version "1.0.0-alpha.8"
resolved "git+https://github.com/hypercore-protocol/autobase.git#1c3833d27e4c3f810351f266033a9b7f70a1245d"
dependencies:
b4a "^1.3.1"
codecs "^3.0.0"
compact-encoding "^2.0.0"
debounceify "^1.0.0"
mutexify "^1.4.0"
safety-catch "^1.0.1"
streamx "^2.10.0"

"autobase@https://github.com/hypercore-protocol/autobase":
version "1.0.0-alpha.8"
uid "1c3833d27e4c3f810351f266033a9b7f70a1245d"
resolved "https://github.com/hypercore-protocol/autobase#1c3833d27e4c3f810351f266033a9b7f70a1245d"
dependencies:
b4a "^1.3.1"
Expand Down

0 comments on commit 6407d80

Please sign in to comment.