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;
}
});