Skip to content

Commit 19d81ef

Browse files
add warning about GIRA service issues before feedback/email (#67)
1 parent cd62654 commit 19d81ef

4 files changed

Lines changed: 56 additions & 6 deletions

File tree

src/lib/components/Profile.svelte

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@
22
import { accountInfo, logOut, user } from '$lib/account';
33
import Metric from '$lib/components/Metric.svelte';
44
import ProfileMenuEntry from '$lib/components/ProfileMenuEntry.svelte';
5+
import ServiceWarningDialog from '$lib/components/ServiceWarningDialog.svelte';
56
import Info from '$lib/components/settings/About.svelte';
67
import History from '$lib/components/settings/History.svelte';
78
import Settings from '$lib/components/settings/Settings.svelte';
89
import { getLocale, t } from '$lib/translations';
9-
import { safeInsets } from '$lib/ui.svelte';
10+
import { enqueueDialog, safeInsets } from '$lib/ui.svelte';
1011
import { App } from '@capacitor/app';
1112
import { Capacitor, type PluginListenerHandle } from '@capacitor/core';
1213
import { IconHeart, IconStar } from '@tabler/icons-svelte';
@@ -41,9 +42,12 @@
4142
4243
return () => backListener?.remove();
4344
});
44-
4545
</script>
4646

47+
{#snippet feedbackWarning(dismiss: () => void)}
48+
<ServiceWarningDialog url="https://github.com/rt-evil-inc/gira-mais/issues" {dismiss} />
49+
{/snippet}
50+
4751
<div transition:fly={{ duration: 150, x: 100 }} class="absolute w-full h-full inset-0 bg-background z-30 grid" >
4852
{#if $user}
4953
<div class="flex flex-col justify-between items-center h-full gap-10 col-start-1 col-end-2 row-start-1 row-end-2 p-4 overflow-x-hidden"
@@ -73,7 +77,7 @@
7377
<div class="flex flex-col grow font-semibold px-2 gap-3 w-full">
7478
<ProfileMenuEntry icon={IconHistory} text={$t('history_label')} subtext={$t('history_subtext')} onclick={() => openPage = 'history'} />
7579
<ProfileMenuEntry icon={IconTool} text={$t('settings_label')} subtext={$t('settings_subtext')} onclick={() => openPage = 'settings'} />
76-
<a href="https://github.com/rt-evil-inc/gira-mais/issues"><ProfileMenuEntry icon={IconMessageReport} text={$t('feedback_label')} subtext={$t('feedback_subtext')} external /></a>
80+
<ProfileMenuEntry icon={IconMessageReport} text={$t('feedback_label')} subtext={$t('feedback_subtext')} external onclick={() => enqueueDialog(feedbackWarning)} />
7781
<ProfileMenuEntry icon={IconInfoCircle} text={$t('about_label')} subtext={$t('about_subtext')} onclick={() => openPage = 'info'} />
7882
{#if Capacitor.getPlatform() === 'ios'}
7983
<a href="https://github.com/rt-evil-inc/gira-mais/"><ProfileMenuEntry icon={IconStar} iconClass="stroke-warning" text={$t('star_label')} subtext={$t('star_subtext')} external /></a>
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<script lang="ts">
2+
import { t } from '$lib/translations';
3+
import IconAlertTriangle from '@tabler/icons-svelte/icons/alert-triangle';
4+
import IconX from '@tabler/icons-svelte/icons/x';
5+
6+
let { url, dismiss }: { url: string, dismiss: () => void } = $props();
7+
8+
const emelEmail = 'gira@emel.pt';
9+
const emelEmailLink = `<a href="mailto:${emelEmail}" class="text-primary underline">${emelEmail}</a>`;
10+
</script>
11+
12+
<div class="w-[340px] max-w-md mx-auto p-6 bg-background rounded-2xl shadow-lg text-left flex flex-col gap-3">
13+
<div class="flex justify-between items-start gap-3">
14+
<h1 class="text-lg font-semibold text-warning flex items-center gap-2">
15+
<IconAlertTriangle size="22" stroke="2" class="shrink-0" />
16+
{$t('service_warning_title')}
17+
</h1>
18+
<IconX class="text-label hover:text-primary cursor-pointer shrink-0" size="24" stroke="1.5" onclick={dismiss} aria-label="Close dialog" />
19+
</div>
20+
<div class="text-sm text-label whitespace-pre-line">{@html $t('service_warning_message', { email: emelEmailLink })}</div>
21+
<div class="flex justify-end gap-5 mt-1 font-bold">
22+
<button class="text-label" onclick={dismiss}>{$t('cancel_button')}</button>
23+
<a href={url} class="text-primary" onclick={dismiss}>{$t('service_warning_continue')}</a>
24+
</div>
25+
</div>

src/lib/components/settings/About.svelte

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
<script lang="ts">
22
import { version } from '$app/environment';
3-
import { safeInsets } from '$lib/ui.svelte';
3+
import { enqueueDialog, safeInsets } from '$lib/ui.svelte';
44
import MenuPage from '$lib/components/MenuPage.svelte';
55
import GitHubStarRequest from '$lib/components/GitHubStarRequest.svelte';
6+
import ServiceWarningDialog from '$lib/components/ServiceWarningDialog.svelte';
67
import { t } from '$lib/translations';
78
import { IconMail, IconWorldWww } from '@tabler/icons-svelte';
89
async function wait(ms:number) {
@@ -34,6 +35,10 @@
3435
}
3536
</script>
3637

38+
{#snippet emailWarning(dismiss: () => void)}
39+
<ServiceWarningDialog url="mailto:contact@gira-mais.app" {dismiss} />
40+
{/snippet}
41+
3742
<MenuPage>
3843
<div class="flex flex-col p-5 relative grow overflow-hidden" style:padding-bottom="{Math.max($safeInsets.bottom, 20)}px">
3944
<div class="text-3xl font-bold text-info pl-2">{$t('about_label')}</div>
@@ -46,9 +51,9 @@
4651
<a href="https://gira-mais.app/">
4752
<IconWorldWww size={24} stroke={1.7} class="stroke-info" />
4853
</a>
49-
<a href="mailto:contact@gira-mais.app">
54+
<button onclick={() => enqueueDialog(emailWarning)} aria-label={$t('email_label')}>
5055
<IconMail size={24} stroke={1.7} class="stroke-info" />
51-
</a>
56+
</button>
5257
<a href="https://gira-mais.app/discord">
5358
<svg class="h-6 fill-info" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Discord</title><path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/></svg>
5459
</a>

src/lib/translations.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -489,6 +489,22 @@ const translations = {
489489
en: 'Invalid bike ID. It should be a 4-digit number.',
490490
pt: 'ID de bicicleta inválido. Deve ser um número de 4 dígitos.',
491491
},
492+
cancel_button: {
493+
en: 'Cancel',
494+
pt: 'Cancelar',
495+
},
496+
service_warning_title: {
497+
en: 'Before you continue',
498+
pt: 'Antes de continuar',
499+
},
500+
service_warning_message: {
501+
en: 'Gira+ is an unofficial app and is not affiliated with EMEL. We can\'t help with problems related to the GIRA service itself, such as trips that won\'t end, charges, account issues, or bike/dock maintenance.\nFor those, please contact EMEL via {{email}}.\n\nOnly continue if your message is about this app.',
502+
pt: 'A Gira+ é uma aplicação não oficial e não está afiliada à EMEL. Não podemos ajudar com problemas relacionados com o serviço GIRA em si, como viagens que não terminam, cobranças, problemas de conta ou manutenção de bicicletas ou docas.\nPara esses casos, contacte a EMEL via {{email}}.\n\nContinue apenas se a sua mensagem for sobre esta aplicação.',
503+
},
504+
service_warning_continue: {
505+
en: 'Continue anyway',
506+
pt: 'Continuar mesmo assim',
507+
},
492508
} as const;
493509

494510
export type Translations = typeof translations;

0 commit comments

Comments
 (0)