From 8bead11ad50f5eb47919eda5e057217760a94828 Mon Sep 17 00:00:00 2001 From: ThatOneCalculator <kainoa@t1c.dev> Date: Tue, 25 Oct 2022 20:33:09 -0700 Subject: [PATCH] feat: :art: add ripple to star react --- packages/client/src/components/MkStarButton.vue | 12 ++++++++++-- packages/client/src/pages/admin/index.vue | 6 +++--- 2 files changed, 13 insertions(+), 5 deletions(-) diff --git a/packages/client/src/components/MkStarButton.vue b/packages/client/src/components/MkStarButton.vue index f0a95ab42..6aa320c67 100644 --- a/packages/client/src/components/MkStarButton.vue +++ b/packages/client/src/components/MkStarButton.vue @@ -1,11 +1,12 @@ <template> -<button class="skdfgljsdkf _button" @click="star()"> +<button class="skdfgljsdkf _button" @click="star($event)"> <i class="fas fa-star"></i> </button> </template> <script lang="ts" setup> import type { Note } from 'misskey-js/built/entities'; +import Ripple from '@/components/MkRipple.vue'; import { pleaseLogin } from '@/scripts/please-login'; import * as os from '@/os'; @@ -13,12 +14,19 @@ const props = defineProps<{ note: Note; }>(); -function star(): void { +function star(ev?: MouseEvent): void { pleaseLogin(); os.api('notes/reactions/create', { noteId: props.note.id, reaction: '⭐', }); + const el = ev && (ev.currentTarget ?? ev.target) as HTMLElement | null | undefined; + if (el) { + const rect = el.getBoundingClientRect(); + const x = rect.left + (el.offsetWidth / 2); + const y = rect.top + (el.offsetHeight / 2); + os.popup(Ripple, { x, y }, {}, 'end'); + } } </script> diff --git a/packages/client/src/pages/admin/index.vue b/packages/client/src/pages/admin/index.vue index 507660d58..fb6fcc5ca 100644 --- a/packages/client/src/pages/admin/index.vue +++ b/packages/client/src/pages/admin/index.vue @@ -69,9 +69,9 @@ os.api('admin/abuse-user-reports', { }); os.api('latest-version').then(res => { - const cleanRes = parseInt(res?.tag_name.replace(/[^0-9]/g, ''), 10); - const cleanVersion = parseInt(version.replace(/[^0-9]/g, ''), 10); - if (cleanRes > cleanVersion) { + const cleanRes = res?.tag_name.replace(/[^0-9]/g, ''); + const cleanVersion = version.replace(/[^0-9]/g, ''); + if (cleanRes !== cleanVersion) { updateAvailable = true; } });