Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

wip: refactor(client): migrate paging components to composition api

Browse source
This commit is contained in:
syuilo 2022-01-13 02:55:19 +09:00
parent bd1f741dad
commit ef4d78dda2
2 changed files with 30 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
packages/client/src/components/reactions-viewer.vue
View file

@ -4,31 +4,19 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { defineComponent } from 'vue'; import { computed } from 'vue';
import * as misskey from 'misskey-js';
import { $i } from '@/account';
import XReaction from './reactions-viewer.reaction.vue'; import XReaction from './reactions-viewer.reaction.vue';
export default defineComponent({ const props = defineProps<{
components: { note: misskey.entities.Note;
XReaction }>();
},
props: { const initialReactions = new Set(Object.keys(props.note.reactions));
note: {
type: Object, const isMe = computed(() => $i && $i.id === props.note.userId);
required: true
},
},
data() {
return {
initialReactions: new Set(Object.keys(this.note.reactions))
};
},
computed: {
isMe(): boolean {
return this.$i && this.$i.id === this.note.userId;
},
},
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

55
packages/client/src/components/waiting-dialog.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<MkModal ref="modal" :prefer-type="'dialog'" :z-priority="'high'" @click="success ? done() : () => {}" @closed="$emit('closed')"> <MkModal ref="modal" :prefer-type="'dialog'" :z-priority="'high'" @click="success ? done() : () => {}" @closed="emit('closed')">
<div class="iuyakobc" :class="{ iconOnly: (text == null) || success }"> <div class="iuyakobc" :class="{ iconOnly: (text == null) || success }">
<i v-if="success" class="fas fa-check icon success"></i> <i v-if="success" class="fas fa-check icon success"></i>
<i v-else class="fas fa-spinner fa-pulse icon waiting"></i> <i v-else class="fas fa-spinner fa-pulse icon waiting"></i>
@ -8,49 +8,30 @@
</MkModal> </MkModal>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { defineComponent } from 'vue'; import { watch, ref } from 'vue';
import MkModal from '@/components/ui/modal.vue'; import MkModal from '@/components/ui/modal.vue';
export default defineComponent({ const modal = ref<InstanceType<typeof MkModal>>();
components: {
MkModal,
},
props: { const props = defineProps<{
success: { success: boolean;
type: Boolean, showing: boolean;
required: true, text?: string;
}, }>();
showing: {
type: Boolean,
required: true,
},
text: {
type: String,
required: false,
},
},
emits: ['done', 'closed'], const emit = defineEmits<{
(e: 'done');
(e: 'closed');
}>();
data() { function done() {
return { emit('done');
}; modal.value.close();
},
watch: {
showing() {
if (!this.showing) this.done();
} }
},
methods: { watch(() => props.showing, () => {
done() { if (!props.showing) done();
this.$emit('done');
this.$refs.modal.close();
},
}
}); });
</script> </script>