mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-12 23:35:58 +00:00
33274e5b9a
* calculate distance between current user and queried user * fix query for unset location * use database to calculate distance * rename distance to distance to me, 100% calculation done in DB * distanceToMe tests * lint fixes * remove comments * Show user teaser popover with badges, Desktop * Refactor UserTeaser and add mobile popover support * Avoid click propagation (WIP) * Prevent event propagation * Adjust alignment and font sizes * More spacing for statistics * Add distance, simplify user link * Refactor location info into own component * Add tests for UserTeaserPopup * Refactor and test LocationInfo * Query distanceToMe, rename distance to distanceToMe * Update test * Improve tests for UserTeaser, WIP * Fix tests * DistanceToMe on User instead of Location * Revert "DistanceToMe on User instead of Location" This reverts commit 96c9db00a44cd120e47bfe9534d3e066a194744c. * Fix notifications * Refactor UserTeaser and fix location info * Fix group member crash * Show 0 distance * Fit in popover on small screens * Allow access to profile on desktop * Revert backend changes * Load user teaser popover data only when needed * Fix type mismatch * Refactor for clarity and accessibility * Litte refactorings and improvements * Fix popover test * Adapt and fix tests * Fix tests and bugs * Add placeholder * cypress: adapt user teaser locator to changes * Remove delays and scrolling * Disable popovers in notification list and fix layout * Remove flickering * Make overlay catch all pointer events on touch devices * Re-add attribute for E2E test * Fix test, return to mouseover * fix snapshot --------- Co-authored-by: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de> Co-authored-by: Wolfgang Huß <wolle.huss@pjannto.com> Co-authored-by: mahula <lenzmath@posteo.de>
548 lines
10 KiB
Plaintext
548 lines
10 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`UserTeaserPopover does not show badges when disabled 1`] = `
|
|
<div>
|
|
<div
|
|
class="user-teaser-popover"
|
|
>
|
|
<!---->
|
|
|
|
<!---->
|
|
|
|
<ul
|
|
class="statistics"
|
|
>
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
profile.followers
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.post
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.comment
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<!---->
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`UserTeaserPopover given a non-touch device does not show button when userLink is provided 1`] = `
|
|
<div>
|
|
<div
|
|
class="user-teaser-popover"
|
|
>
|
|
<div
|
|
class="hc-badges"
|
|
>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/verified"
|
|
title="Verified"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy1"
|
|
title="Trophy 1"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy2"
|
|
title="Trophy 2"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/empty"
|
|
title="Empty"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!---->
|
|
|
|
<ul
|
|
class="statistics"
|
|
>
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
profile.followers
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.post
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.comment
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<!---->
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`UserTeaserPopover given a touch device does not show button when userLink is not provided 1`] = `
|
|
<div>
|
|
<div
|
|
class="user-teaser-popover"
|
|
>
|
|
<div
|
|
class="hc-badges"
|
|
>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/verified"
|
|
title="Verified"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy1"
|
|
title="Trophy 1"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy2"
|
|
title="Trophy 2"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/empty"
|
|
title="Empty"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!---->
|
|
|
|
<ul
|
|
class="statistics"
|
|
>
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
profile.followers
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.post
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.comment
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<!---->
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`UserTeaserPopover given a touch device shows button when userLink is provided 1`] = `
|
|
<div>
|
|
<div
|
|
class="user-teaser-popover"
|
|
>
|
|
<div
|
|
class="hc-badges"
|
|
>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/verified"
|
|
title="Verified"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy1"
|
|
title="Trophy 1"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy2"
|
|
title="Trophy 2"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/empty"
|
|
title="Empty"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!---->
|
|
|
|
<ul
|
|
class="statistics"
|
|
>
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
profile.followers
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.post
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.comment
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<!---->
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`UserTeaserPopover shows badges when enabled 1`] = `
|
|
<div>
|
|
<div
|
|
class="user-teaser-popover"
|
|
>
|
|
<div
|
|
class="hc-badges"
|
|
>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/verified"
|
|
title="Verified"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy1"
|
|
title="Trophy 1"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/trophy2"
|
|
title="Trophy 2"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="hc-badge-container"
|
|
>
|
|
<img
|
|
class="hc-badge"
|
|
src="/api/icons/empty"
|
|
title="Empty"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!---->
|
|
|
|
<ul
|
|
class="statistics"
|
|
>
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
profile.followers
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.post
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
|
|
<li>
|
|
<div
|
|
class="ds-number ds-number-size-x-large"
|
|
>
|
|
<p
|
|
class="ds-text ds-number-count ds-text-size-x-large"
|
|
style="margin-bottom: 0px;"
|
|
>
|
|
0
|
|
</p>
|
|
<p
|
|
class="ds-text ds-number-label ds-text-size-small ds-text-soft"
|
|
>
|
|
|
|
common.comment
|
|
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<!---->
|
|
</div>
|
|
</div>
|
|
`;
|