How to Get Today's Task Words (New and Review) Using the TypeWords Pinia Store

Use the createStudyTask composable to generate a TaskWords object containing new and review arrays, or access pre-populated data from useRuntimeStore().routeData.taskWords after navigation.

The TypeWords application manages daily vocabulary study sessions through a Pinia-based architecture. Understanding how to retrieve today's task words—both new words to learn and review words to reinforce—is essential for building custom study interfaces or extending the app's functionality.

Core Architecture

TypeWords separates concerns across multiple specialized stores that feed into the task generation workflow:

Component	Role	Key Source
Base Store (useBaseStore)	Master dictionary (sdict), last learned index, daily study count	app/core/stores/base.ts
Setting Store (useSettingStore)	User preferences: review-to-new ratio, auto-add random reviews	app/core/stores/setting.ts
Study-Task Helper (createStudyTask)	Orchestrates TaskWords creation with new and review arrays	app/core/composables/practice-words/study-task.ts
Runtime Store (useRuntimeStore)	Holds transient route data including pre-generated taskWords	app/core/stores/runtime.ts

The resulting TaskWords structure follows this TypeScript interface:

export interface TaskWords {
  new: Word[]      // Never-studied words assigned for today
  review: Word[]   // Due reviews + optional random reviews
}

Method 1: Generate Task Words with createStudyTask

For components that need direct access without relying on navigation state, import and invoke the createStudyTask composable:

import { createStudyTask } from '@/core/composables/practice-words/study-task.ts'

const { taskWords } = createStudyTask()

// Access today's assignments
console.log('New words:', taskWords.new.length)
console.log('Review words:', taskWords.review.length)

How createStudyTask Builds the Task

The helper executes this sequence in app/core/composables/practice-words/study-task.ts:

1. Fetches the current study word set via getCurrentStudyWord()
2. Calculates due review items based on spacing intervals
3. Applies the user's wordReviewRatio setting to balance new vs. review counts
4. Conditionally triggers addRandomReviewWhenNoDue()—when no reviews are due and autoAddRandomReviewWhenNoDue is enabled, it shuffles previously learned words into the review array

The function returns a StudyTaskResult containing the populated TaskWords object ready for immediate use.

Method 2: Access Task Words from the Runtime Store

When pages navigate with pre-generated task data (from the dictionary page or study initiation flow), the TaskWords object resides in the runtime store:

import { useRuntimeStore } from '@/core/stores/runtime.ts'

const runtimeStore = useRuntimeStore()

if (runtimeStore.routeData?.taskWords) {
  const task = runtimeStore.routeData.taskWords as TaskWords
  
  console.log('New count:', task.new.length)
  console.log('Review count:', task.review.length)
}

This pattern appears in the application's core study pages:

• app/pages/(words)/practice-words/[id].vue
• app/pages/(words)/words-test/[id].vue

Complete Component Example

Here's a minimal Vue 3 component displaying today's task summary using both approaches:

Direct Helper Approach

<script setup lang="ts">
import { createStudyTask } from '@/core/composables/practice-words/study-task.ts'

const { taskWords } = createStudyTask()
</script>

<template>
  <div class="task-summary">
    <p>New words today: <strong>{{ taskWords.new.length }}</strong></p>
    <p>Review words today: <strong>{{ taskWords.review.length }}</strong></p>
  </div>
</template>

<style scoped>
.task-summary { font-size: 1.2rem; margin: 1rem; }
</style>

Runtime Store Approach

<script setup lang="ts">
import { useRuntimeStore } from '@/core/stores/runtime.ts'

const runtimeStore = useRuntimeStore()
const taskWords = computed(() => 
  runtimeStore.routeData?.taskWords ?? { new: [], review: [] }
)
</script>

Customizing Task Generation Behavior

The createStudyTask helper respects these setting store values defined in app/core/stores/setting.ts:

Setting	Effect on Task Words
wordReviewRatio	Balances proportion of new vs. review words
autoAddRandomReviewWhenNoDue	Triggers fallback random reviews when no items are due
Daily study count (from base store)	Caps the total new words assigned

Modify these values through the setting store to alter task composition without changing calling code.

Summary

• createStudyTask() in app/core/composables/practice-words/study-task.ts generates fresh TaskWords objects with new and review arrays
• useRuntimeStore().routeData.taskWords provides cached access after navigation
• The base store (app/core/stores/base.ts) supplies dictionary data and progress tracking
• The setting store (app/core/stores/setting.ts) controls review ratios and random review fallback behavior
• Core consumption occurs in practice-words/[id].vue and words-test/[id].vue pages

Frequently Asked Questions

How does TypeWords determine which words are "due" for review?

The createStudyTask helper evaluates each word's scheduling metadata through getCurrentStudyWord(), comparing the next review timestamp against the current date. Words with elapsed intervals populate the review array; due count insufficient for the target ratio triggers addRandomReviewWhenNoDue when enabled.

Can I get task words without triggering random review fallback?

Yes—call createStudyTask() with autoAddRandomReviewWhenNoDue disabled in the setting store, or extract and modify the helper logic in app/core/composables/practice-words/study-task.ts to bypass the addRandomReviewWhenNoDue call for specific use cases.

What's the difference between base store and runtime store taskWords?

The base store (app/core/stores/base.ts) contains persistent learning progress—dictionary data, last learned position, and historical statistics. The runtime store (app/core/stores/runtime.ts) holds ephemeral navigation state; routeData.taskWords exists only for the current page session and regenerates on fresh navigation.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}