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

> Learn to get today's task words for new and review items using the TypeWords Pinia store. Explore the createStudyTask composable or access route data for your vocabulary study.

- Repository: [Zyronon/TypeWords](https://github.com/zyronon/TypeWords)
- Tags: how-to-guide
- Published: 2026-09-03

---

**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`](https://github.com/zyronon/TypeWords/blob/main/app/core/stores/base.ts) |
| **Setting Store** (`useSettingStore`) | User preferences: review-to-new ratio, auto-add random reviews | [`app/core/stores/setting.ts`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/app/core/composables/practice-words/study-task.ts) |
| **Runtime Store** (`useRuntimeStore`) | Holds transient route data including pre-generated `taskWords` | [`app/core/stores/runtime.ts`](https://github.com/zyronon/TypeWords/blob/main/app/core/stores/runtime.ts) |

The resulting `TaskWords` structure follows this TypeScript interface:

```ts
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:

```ts
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`](https://github.com/zyronon/TypeWords/blob/main/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:

```ts
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

```vue
<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

```vue
<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`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/app/core/stores/base.ts)) supplies dictionary data and progress tracking
- The **setting store** ([`app/core/stores/setting.ts`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/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`](https://github.com/zyronon/TypeWords/blob/main/app/core/stores/runtime.ts)) holds ephemeral navigation state; `routeData.taskWords` exists only for the current page session and regenerates on fresh navigation.