Custom StatusCard.jsx Links Not Working Properly in Native Traccar iOS App

LocoGPS6 days ago

I'm trying to add custom links to the StatusCard.jsx. While the existing links (Apple Maps, Google Maps) work fine with a single tap, my custom links only work when long-pressing them and then pressing the preview. A normal tap doesn't trigger any action.

I've copied the implementation style of the working links (Apple Maps, Google Maps)
The custom links are structured the same way as the existing ones.
Long-press functionality works as expected
Single tap functionality doesn't work at all. It should open external browser on phone.

<Menu anchorEl={anchorEl} open={Boolean(anchorEl)} onClose={() => setAnchorEl(null)}>
    <MenuItem onClick={handleGeofence}>
        {t('sharedCreateGeofence')}
    </MenuItem>
    
    <MenuItem 
        component="a" 
        target="_blank" 
        href={`https://www.google.com/maps/search/?api=1&query=${position.latitude}%2C${position.longitude}`}
    >
        {t('linkGoogleMaps')}
    </MenuItem>
    
    <MenuItem 
        component="a" 
        target="_blank" 
        href={`http://maps.apple.com/?ll=${position.latitude},${position.longitude}`}
    >
        {t('linkAppleMaps')}
    </MenuItem>
    
    <MenuItem 
        component="a" 
        target="_blank" 
        href={`https://www.google.com/maps/@?api=1&map_action=pano&viewpoint=${position.latitude}%2C${position.longitude}&heading=${position.course}`}
    >
        {t('linkStreetView')}
    </MenuItem>
    
    <MenuItem 
        component="a" 
        target="_blank" 
        href={`https://traccar.org`}
    >
        {t('customLink')}
    </MenuItem>
</Menu>

Are there specific requirements or considerations for implementing custom bottom menu links in the iOS app?
Is there additional configuration needed to enable single-tap functionality?

I really looked at everything but i can't find the problem. It's really weird.

Every help is appreciated. Thank you!