fix: Hall of Chaos quality fixes -- timer cleanup, aria-live, reduced-motion

- onUnmounted clears blooperHoldTimer to prevent stale callback after
  component teardown
- HallOfChaosView loading state gains aria-live="polite" so state
  transitions are announced to screen readers
- CommunityFeedPanel reduced-motion block resets toast translateY offset
  to avoid flash-of-offset-position on slow paint cycles
This commit is contained in:
pyr0ball 2026-04-13 12:34:23 -07:00
parent 9246935fd7
commit d7bfc083e7
2 changed files with 14 additions and 2 deletions

View file

@ -116,7 +116,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted } from 'vue' import { ref, onMounted, onUnmounted } from 'vue'
import { useCommunityStore } from '../stores/community' import { useCommunityStore } from '../stores/community'
import CommunityPostCard from './CommunityPostCard.vue' import CommunityPostCard from './CommunityPostCard.vue'
import PublishPlanModal from './PublishPlanModal.vue' import PublishPlanModal from './PublishPlanModal.vue'
@ -217,6 +217,13 @@ onMounted(async () => {
await store.fetchPosts() await store.fetchPosts()
} }
}) })
onUnmounted(() => {
if (blooperHoldTimer !== null) {
clearTimeout(blooperHoldTimer)
blooperHoldTimer = null
}
})
</script> </script>
<style scoped> <style scoped>
@ -320,5 +327,10 @@ onMounted(async () => {
.toast-fade-leave-active { .toast-fade-leave-active {
transition: none; transition: none;
} }
.toast-fade-enter-from,
.toast-fade-leave-to {
transform: translateX(-50%);
}
} }
</style> </style>

View file

@ -17,7 +17,7 @@
</div> </div>
<!-- Loading --> <!-- Loading -->
<div v-if="loading" class="chaos-loading text-center text-secondary" aria-busy="true"> <div v-if="loading" class="chaos-loading text-center text-secondary" aria-live="polite" aria-busy="true">
Assembling the chaos... Assembling the chaos...
</div> </div>