ui: more visible feedback button

This commit is contained in:
Andras Bacsai 2023-09-25 09:34:32 +02:00
parent 872981b8b4
commit 3e4db2f5b2
5 changed files with 19 additions and 25 deletions

View File

@ -4,8 +4,8 @@
use DanHarrin\LivewireRateLimiting\WithRateLimiting;
use Illuminate\Notifications\Messages\MailMessage;
use Illuminate\Support\Facades\Route;
use Livewire\Component;
use Route;
class Help extends Component
{
@ -28,7 +28,7 @@ public function mount()
public function submit()
{
try {
$this->rateLimit(1, 60);
$this->rateLimit(3, 60);
$this->validate();
$subscriptionType = auth()->user()?->subscription?->type() ?? 'Free';
$debug = "Route: {$this->path}";
@ -42,7 +42,7 @@ public function submit()
);
$mail->subject("[HELP - {$subscriptionType}]: {$this->subject}");
send_user_an_email($mail, auth()->user()?->email, 'hi@coollabs.io');
$this->emit('success', 'Your message has been sent successfully. We will get in touch with you as soon as possible.');
$this->emit('success', 'Your message has been sent successfully. <br>We will get in touch with you as soon as possible.');
} catch (\Throwable $e) {
return handleError($e, $this);
}

View File

@ -10,16 +10,12 @@
</svg>
</a>
</li>
<li title="Help" class="mt-auto">
<div class="justify-center icons" wire:click="help" onclick="help.showModal()">
<svg class="{{ request()->is('help*') ? 'text-warning icon' : 'icon' }}" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2">
<path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m9 4v.01" />
<path d="M12 13a2 2 0 0 0 .914-3.782a1.98 1.98 0 0 0-2.414.483" />
</g>
<li title="Send feedback or get help" class="fixed top-0 right-0 p-2 px-6 pt-4 mt-auto">
<div class="justify-center text-xs bg-coolgray-200" wire:click="help" onclick="help.showModal()">
<svg class="w-4 h-4" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M22 5.5H9c-1.1 0-2 .9-2 2v9a2 2 0 0 0 2 2h13c1.11 0 2-.89 2-2v-9a2 2 0 0 0-2-2m0 11H9V9.17l6.5 3.33L22 9.17v7.33m-6.5-5.69L9 7.5h13l-6.5 3.31M5 16.5c0 .17.03.33.05.5H1c-.552 0-1-.45-1-1s.448-1 1-1h4v1.5M3 7h2.05c-.02.17-.05.33-.05.5V9H3c-.55 0-1-.45-1-1s.45-1 1-1m-2 5c0-.55.45-1 1-1h3v2H2c-.55 0-1-.45-1-1Z"/>
</svg>
Feedback
</div>
</li>
<li class="pb-6" title="Logout">

View File

@ -114,16 +114,12 @@ class="{{ request()->is('settings*') ? 'text-warning icon' : 'icon' }}" viewBox=
</li>
@endif
@if (isSubscriptionActive() || isDev())
<li title="Help" class="mt-auto">
<div class="justify-center icons" wire:click="help" onclick="help.showModal()">
<svg class="{{ request()->is('help*') ? 'text-warning icon' : 'icon' }}" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2">
<path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m9 4v.01" />
<path d="M12 13a2 2 0 0 0 .914-3.782a1.98 1.98 0 0 0-2.414.483" />
</g>
<li title="Send feedback or get help" class="fixed top-0 right-0 p-2 px-6 pt-4 mt-auto">
<div class="justify-center text-xs bg-coolgray-200" wire:click="help" onclick="help.showModal()">
<svg class="w-4 h-4" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor" d="M22 5.5H9c-1.1 0-2 .9-2 2v9a2 2 0 0 0 2 2h13c1.11 0 2-.89 2-2v-9a2 2 0 0 0-2-2m0 11H9V9.17l6.5 3.33L22 9.17v7.33m-6.5-5.69L9 7.5h13l-6.5 3.31M5 16.5c0 .17.03.33.05.5H1c-.552 0-1-.45-1-1s.448-1 1-1h4v1.5M3 7h2.05c-.02.17-.05.33-.05.5V9H3c-.55 0-1-.45-1-1s.45-1 1-1m-2 5c0-.55.45-1 1-1h3v2H2c-.55 0-1-.45-1-1Z"/>
</svg>
Feedback
</div>
</li>
@endif

View File

@ -94,6 +94,7 @@ function upgrade() {
})
}, 2000);
}
function copyToClipboard(text) {
navigator.clipboard.writeText(text);
Livewire.emit('success', 'Copied to clipboard.');

View File

@ -1,10 +1,11 @@
<div class="flex flex-col gap-2 rounded modal-box">
<div class="flex flex-col w-11/12 max-w-5xl gap-2 modal-box">
<h3>How can we help?</h3>
<div>You can report bug about the current page (details will be included automatically), or send us general feedback.</div>
<div>You can report bugs, or send us general feedback.</div>
<form wire:submit.prevent="submit" class="flex flex-col gap-4 pt-4">
<x-forms.input id="subject" label="Subject" placeholder="Summary of your problem."></x-forms.input>
<x-forms.textarea id="description" label="Message"
<x-forms.textarea rows="10" id="description" label="Description"
placeholder="Please provide as much information as possible."></x-forms.textarea>
<x-forms.button class="w-full mt-4" type="submit">Send Request</x-forms.button>
<div>Thank you for your feedback! 💜</div>
<x-forms.button class="w-full mt-4" type="submit" onclick="help.close()">Send Email</x-forms.button>
</form>
</div>