zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

feat: totally hide strict filters (#948)

Browse source
This commit is contained in:
Ayo Ayco 2023-01-23 20:33:21 +01:00 • committed by GitHub
parent 1a7ae6f0ef
commit a08f56676d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 82 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

13
components/status/StatusCard.vue
View file

@ -67,13 +67,6 @@ const createdAt = useFormattedDateTime(status.createdAt)
const timeAgoOptions = useTimeAgoOptions(true)
const timeago = useTimeAgo(() => status.createdAt, timeAgoOptions)
// Content Filter logic
const filterResult = $computed(() => status.filtered?.length ? status.filtered[0] : null)
const filter = $computed(() => filterResult?.filter)
const filterPhrase = $computed(() => filter?.title)
const isFiltered = $computed(() => filterPhrase && (props.context ? filter?.context.includes(props.context) : false))
const isSelfReply = $computed(() => status.inReplyToAccountId === status.account.id)
const collapseRebloggedBy = $computed(() => rebloggedBy?.id === status.account.id)
const isDM = $computed(() => status.visibility === 'direct')
@ -84,7 +77,6 @@ const showReplyTo = $computed(() => !replyToMain && !directReply)
<template>
<div
v-if="filter?.filterAction !== 'hide'"
:id="`status-${status.id}`"
ref="el"
relative flex="~ col gap1" p="l-3 r-4 b-2"
@ -189,9 +181,4 @@ const showReplyTo = $computed(() => !replyToMain && !directReply)
</div>
</div>
</div>
<div v-else-if="isFiltered" gap-2 p-4 :class="{ 'border-t border-base': newer }">
<p text-center text-secondary text-sm>
{{ filterPhrase && `${$t('status.filter_removed_phrase')}: ${filterPhrase}` }}
</p>
</div>
</template>

2
components/status/StatusContent.vue
View file

@ -27,7 +27,7 @@ const isFiltered = $computed(() => filterPhrase && (context && context !== 'deta
}"
>
<StatusBody v-if="!isFiltered && status.sensitive && !status.spoilerText" :status="status" :newer="newer" :with-action="!isDetails" :class="isDetails ? 'text-xl' : ''" />
<StatusSpoiler :enabled="status.sensitive || isFiltered" :filter="isFiltered">
<StatusSpoiler :enabled="status.sensitive || isFiltered" :filter="isFiltered" :is-d-m="isDM">
<template v-if="filterPhrase" #spoiler>
<p>{{ `${$t('status.filter_hidden_phrase')}: ${filterPhrase}` }}</p>
</template>

6
components/status/StatusSpoiler.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const props = defineProps<{ enabled?: boolean; filter?: boolean }>()
const props = defineProps<{ enabled?: boolean; filter?: boolean; isDM?: boolean }>()
const showContent = ref(!props.enabled)
const toggleContent = useToggle(showContent)
@ -14,8 +14,8 @@ watchEffect(() => {
<div class="content-rich" p="x-4 b-2.5" text-center text-secondary w-full border="~ base" border-0 border-b-dotted border-b-3 mt-2>
<slot name="spoiler" />
</div>
<div flex="~ gap-1 center" w-full mt="-4.5">
<button btn-text px-2 py-1 bg-base flex="~ center gap-2" :class="showContent ? '' : 'filter-saturate-0 hover:filter-saturate-100'" @click="toggleContent()">
<div flex="~ gap-1 center" w-full :mb="isDM && !showContent ? '4' : ''" mt="-4.5">
<button btn-text px-2 py-1 :bg="isDM ? 'transparent' : 'base'" flex="~ center gap-2" :class="showContent ? '' : 'filter-saturate-0 hover:filter-saturate-100'" @click="toggleContent()">
<div v-if="showContent" i-ri:eye-line />
<div v-else i-ri:eye-close-line />
{{ showContent ? $t('status.spoiler_show_less') : $t(filter ? 'status.filter_show_anyway' : 'status.spoiler_show_more') }}