antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2026-03-01 12:44:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

connect button

Browse Source
This commit is contained in:
Anton Tranelis 2025-09-14 13:32:47 +02:00
parent d8b8670ee8
commit 05209bb62a
1 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
lib/src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx
View File

@ -15,6 +15,7 @@ import { MapPinIcon, ShareIcon, QrCodeIcon } from '@heroicons/react/24/solid'
import PencilIcon from '@heroicons/react/24/solid/PencilIcon' import PencilIcon from '@heroicons/react/24/solid/PencilIcon'
import TrashIcon from '@heroicons/react/24/solid/TrashIcon' import TrashIcon from '@heroicons/react/24/solid/TrashIcon'
import { useState } from 'react' import { useState } from 'react'
import { FaPlus } from 'react-icons/fa6'
import { LuNavigation } from 'react-icons/lu' import { LuNavigation } from 'react-icons/lu'
import SVG from 'react-inlinesvg' import SVG from 'react-inlinesvg'
import QRCode from 'react-qr-code' import QRCode from 'react-qr-code'
@ -228,7 +229,7 @@ export function HeaderView({
<MapPinIcon className='tw:w-4 tw:mr-1 tw:flex-shrink-0' /> <MapPinIcon className='tw:w-4 tw:mr-1 tw:flex-shrink-0' />
<span title={address} className='tw:truncate'> <span title={address} className='tw:truncate'>
{address} {address}
{distance && distance >= 1 && ` (${formatDistance(distance)})`} {distance && distance >= 0.1 && ` (${formatDistance(distance)})`}
</span> </span>
</div> </div>
)} )}
@ -248,8 +249,8 @@ export function HeaderView({
hasUserPermission(api?.collectionName!, 'update', item)) && hasUserPermission(api?.collectionName!, 'update', item)) &&
!hideMenu && ( !hideMenu && (
<div className='tw:dropdown tw:dropdown-bottom tw:dropdown-center'> <div className='tw:dropdown tw:dropdown-bottom tw:dropdown-center'>
<label tabIndex={0} className='tw:btn tw:btn-ghost tw:px-3'> <label tabIndex={0} className='tw:btn tw:btn-ghost tw:px-2.5'>
<EllipsisVerticalIcon className='tw:h-4 tw:w-4' /> <EllipsisVerticalIcon className='tw:h-5 tw:w-5' />
</label> </label>
<ul <ul
tabIndex={0} tabIndex={0}
@ -317,16 +318,18 @@ export function HeaderView({
style={{ style={{
backgroundColor: `${item?.color ?? (item && (getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : (item?.layer?.markerDefaultColor ?? '#000')))}`, backgroundColor: `${item?.color ?? (item && (getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : (item?.layer?.markerDefaultColor ?? '#000')))}`,
}} }}
className='tw:btn tw:text-white tw:mr-2 ' className='tw:btn tw:text-white tw:mr-2 tw:tooltip tw:tooltip-top '
data-tip={item.layer?.itemType.cta_button_label}
> >
{item.layer?.itemType.cta_button_label ?? 'Follow'} <FaPlus className='tw:w-5' /> Connect
</button> </button>
{item?.position?.coordinates ? ( {item?.position?.coordinates ? (
<a <a
href={getNavigationUrl()} href={getNavigationUrl()}
target='_blank' target='_blank'
data-tip='Navigate'
rel='noopener noreferrer' rel='noopener noreferrer'
className='tw:btn tw:mr-2 tw:px-3' className='tw:btn tw:mr-2 tw:px-3 tw:tooltip tw:tooltip-top'
style={{ color: 'inherit' }} style={{ color: 'inherit' }}
title={`Navigate with ${isMobile ? 'default navigation app' : isIOS ? 'Apple Maps' : 'Google Maps'}`} title={`Navigate with ${isMobile ? 'default navigation app' : isIOS ? 'Apple Maps' : 'Google Maps'}`}
> >
@ -339,13 +342,19 @@ export function HeaderView({
)} )}
<button <button
onClick={() => setQrModalOpen(true)} onClick={() => setQrModalOpen(true)}
className='tw:btn tw:mr-2 tw:px-3' className='tw:btn tw:mr-2 tw:px-3 tw:tooltip tw:tooltip-top'
title='QR-Code teilen' title='QR-Code'
data-tip='QR Code'
> >
<QrCodeIcon className='tw:h-4 tw:w-4' /> <QrCodeIcon className='tw:h-4 tw:w-4' />
</button> </button>
<div className='tw:dropdown tw:dropdown-end'> <div className='tw:dropdown tw:dropdown-end'>
<div tabIndex={0} role='button' className='tw:btn tw:px-3'> <div
tabIndex={0}
role='button'
className='tw:btn tw:px-3 tw:tooltip tw:tooltip-top'
data-tip='Share'
>
<ShareIcon className='tw:w-4 tw:h-4' /> <ShareIcon className='tw:w-4 tw:h-4' />
</div> </div>
<ul <ul