refactor: follow button (#8789)
* fix: display cancelling follow request * remove unnecessary branch The executed code is the same as in the else branch so this special condition is unnecessary. * remove code duplication Use the same callback as later for updating these variables. * use $ref sugar * remove unused import Co-authored-by: blackskye-sx <saul.newman@gmail.com>
This commit is contained in:
parent
78df3dc484
commit
42f48ffea2
1 changed files with 14 additions and 20 deletions
|
@ -28,7 +28,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { onBeforeUnmount, onMounted, ref } from 'vue';
|
import { onBeforeUnmount, onMounted } from 'vue';
|
||||||
import * as Misskey from 'misskey-js';
|
import * as Misskey from 'misskey-js';
|
||||||
import * as os from '@/os';
|
import * as os from '@/os';
|
||||||
import { stream } from '@/stream';
|
import { stream } from '@/stream';
|
||||||
|
@ -43,32 +43,30 @@ const props = withDefaults(defineProps<{
|
||||||
large: false,
|
large: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
const isFollowing = ref(props.user.isFollowing);
|
let isFollowing = $ref(props.user.isFollowing);
|
||||||
const hasPendingFollowRequestFromYou = ref(props.user.hasPendingFollowRequestFromYou);
|
let hasPendingFollowRequestFromYou = $ref(props.user.hasPendingFollowRequestFromYou);
|
||||||
const wait = ref(false);
|
let wait = $ref(false);
|
||||||
const connection = stream.useChannel('main');
|
const connection = stream.useChannel('main');
|
||||||
|
|
||||||
if (props.user.isFollowing == null) {
|
if (props.user.isFollowing == null) {
|
||||||
os.api('users/show', {
|
os.api('users/show', {
|
||||||
userId: props.user.id
|
userId: props.user.id
|
||||||
}).then(u => {
|
})
|
||||||
isFollowing.value = u.isFollowing;
|
.then(onFollowChange);
|
||||||
hasPendingFollowRequestFromYou.value = u.hasPendingFollowRequestFromYou;
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function onFollowChange(user: Misskey.entities.UserDetailed) {
|
function onFollowChange(user: Misskey.entities.UserDetailed) {
|
||||||
if (user.id === props.user.id) {
|
if (user.id === props.user.id) {
|
||||||
isFollowing.value = user.isFollowing;
|
isFollowing = user.isFollowing;
|
||||||
hasPendingFollowRequestFromYou.value = user.hasPendingFollowRequestFromYou;
|
hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function onClick() {
|
async function onClick() {
|
||||||
wait.value = true;
|
wait = true;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (isFollowing.value) {
|
if (isFollowing) {
|
||||||
const { canceled } = await os.confirm({
|
const { canceled } = await os.confirm({
|
||||||
type: 'warning',
|
type: 'warning',
|
||||||
text: i18n.t('unfollowConfirm', { name: props.user.name || props.user.username }),
|
text: i18n.t('unfollowConfirm', { name: props.user.name || props.user.username }),
|
||||||
|
@ -80,26 +78,22 @@ async function onClick() {
|
||||||
userId: props.user.id
|
userId: props.user.id
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
if (hasPendingFollowRequestFromYou.value) {
|
if (hasPendingFollowRequestFromYou) {
|
||||||
await os.api('following/requests/cancel', {
|
await os.api('following/requests/cancel', {
|
||||||
userId: props.user.id
|
userId: props.user.id
|
||||||
});
|
});
|
||||||
} else if (props.user.isLocked) {
|
hasPendingFollowRequestFromYou = false;
|
||||||
await os.api('following/create', {
|
|
||||||
userId: props.user.id
|
|
||||||
});
|
|
||||||
hasPendingFollowRequestFromYou.value = true;
|
|
||||||
} else {
|
} else {
|
||||||
await os.api('following/create', {
|
await os.api('following/create', {
|
||||||
userId: props.user.id
|
userId: props.user.id
|
||||||
});
|
});
|
||||||
hasPendingFollowRequestFromYou.value = true;
|
hasPendingFollowRequestFromYou = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
} finally {
|
} finally {
|
||||||
wait.value = false;
|
wait = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue