QuestService - Tareas - Gamified Task Manager

Overview

The QuestService is the primary service for managing quests in the Tareas application. It provides complete CRUD operations, localStorage persistence, and reactive state management using RxJS BehaviorSubject. Located at: src/app/services/quest.service.ts

Features

Full CRUD operations (Create, Read, Update, Delete)
Automatic localStorage persistence
Reactive state management with BehaviorSubject
Category, status, and difficulty filtering
Search functionality
Quest statistics and analytics
Quest status management (pending, in-progress, completed)

Core Methods

getQuests()

Returns an Observable stream of all quests. Subscribe to this to receive real-time updates when quests change.

getQuests(): Observable<Quest[]>

Observable<Quest[]>

Observable

Observable stream that emits the current quest array whenever it changes

Usage Example

import { QuestService } from './services/quest.service';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-quest-list',
  templateUrl: './quest-list.component.html'
})
export class QuestListComponent implements OnInit {
  quests$ = this.questService.getQuests();

  constructor(private questService: QuestService) {}
}

getAllQuests()

Returns all quests synchronously as an array (current snapshot).

getAllQuests(): Quest[]

Quest[]

array

Current array of all quests

Usage Example

const allQuests = this.questService.getAllQuests();
console.log(`Total quests: ${allQuests.length}`);

getQuestById()

Retrieves a single quest by its unique ID.

getQuestById(id: string): Quest | undefined

string

required

The unique identifier of the quest

Quest | undefined

Quest

The quest object if found, undefined otherwise

Usage Example

const quest = this.questService.getQuestById('quest-123');
if (quest) {
  console.log(quest.title);
}

createQuest()

Creates a new quest and persists it to localStorage.

createQuest(questData: Omit<Quest, 'id' | 'createdAt'>): Quest

questData

Omit<Quest, 'id' | 'createdAt'>

required

Quest data without id and createdAt (these are generated automatically)

Quest

The newly created quest with generated id and createdAt timestamp

Usage Example

const newQuest = this.questService.createQuest({
  title: 'Build API Documentation',
  description: 'Create comprehensive API docs',
  category: 'dev',
  difficulty: 2,
  xpReward: 500,
  status: 'pending',
  icon: 'code',
  colorClass: 'realm-dev',
  glowClass: 'glow-dev',
  kingdom: 'Development',
  dueDate: '2024-12-31',
  reward: 'Knowledge gained',
  badges: [],
  tags: ['documentation', 'api']
});

updateQuest()

Updates an existing quest with partial data.

updateQuest(id: string, updates: Partial<Quest>): Quest | null

string

required

The ID of the quest to update

updates

Partial<Quest>

required

Object containing the fields to update

Quest | null

Quest

The updated quest object, or null if quest not found

Usage Example

const updated = this.questService.updateQuest('quest-123', {
  title: 'Updated Title',
  difficulty: 3,
  status: 'in-progress'
});

deleteQuest()

Deletes a quest by ID and removes it from localStorage.

deleteQuest(id: string): boolean

string

required

The ID of the quest to delete

boolean

Returns true if quest was deleted, false if quest not found

Usage Example

const wasDeleted = this.questService.deleteQuest('quest-123');
if (wasDeleted) {
  console.log('Quest deleted successfully');
}

Status Management

updateQuestStatus()

Updates only the status field of a quest.

updateQuestStatus(id: string, status: 'pending' | 'in-progress' | 'completed'): Quest | null

string

required

The ID of the quest

status

'pending' | 'in-progress' | 'completed'

required

The new status value

Quest | null

Quest

The updated quest or null if not found

completeQuest()

Marks a quest as completed and sets completion timestamp.

completeQuest(id: string): Quest | null

string

required

The ID of the quest to complete

Quest | null

Quest

The completed quest with status=‘completed’, completed=true, and completedAt timestamp

Usage Example

const completed = this.questService.completeQuest('quest-123');
if (completed) {
  console.log(`Quest completed at: ${completed.completedAt}`);
}

Filtering Methods

getQuestsByCategory()

Returns all quests for a specific category.

getQuestsByCategory(category: string): Quest[]

getQuestsByStatus()

Returns all quests with a specific status.

getQuestsByStatus(status: 'pending' | 'in-progress' | 'completed'): Quest[]

status

'pending' | 'in-progress' | 'completed'

required

The status to filter by

Quest[]

array

Array of quests matching the status

Usage Example

const pendingQuests = this.questService.getQuestsByStatus('pending');
const completedQuests = this.questService.getQuestsByStatus('completed');

getQuestsByDifficulty()

Returns all quests with a specific difficulty level.

getQuestsByDifficulty(difficulty: number): Quest[]

difficulty

number

required

Difficulty level (1=Easy, 2=Medium, 3=Hard)

Quest[]

array

Array of quests matching the difficulty level

searchQuests()

Searches quests by title or description (case-insensitive).

searchQuests(query: string): Quest[]

query

string

required

Search term to match against title and description

Quest[]

array

Array of quests matching the search query

Usage Example

const results = this.questService.searchQuests('API');
// Returns quests with 'API' in title or description

Analytics

getQuestStats()

Returns comprehensive statistics about all quests.

getQuestStats(): {
  total: number;
  completed: number;
  pending: number;
  inProgress: number;
  totalXP: number;
  completedXP: number;
}

total

number

Total number of quests

completed

number

Number of completed quests

pending

number

Number of pending quests

inProgress

number

Number of in-progress quests

totalXP

number

Sum of XP rewards from all quests

completedXP

number

Sum of XP rewards from completed quests

Usage Example

const stats = this.questService.getQuestStats();
console.log(`Completion rate: ${(stats.completed / stats.total * 100).toFixed(1)}%`);
console.log(`XP earned: ${stats.completedXP} / ${stats.totalXP}`);

Utility Methods

clearAllQuests()

Deletes all quests from memory and localStorage (useful for development/testing).

clearAllQuests(): void

This permanently deletes all quests. Use with caution.

importQuests()

Imports an array of quests, replacing all existing quests.

importQuests(quests: Quest[]): void

quests

Quest[]

required

Array of quest objects to import

Usage Example

// Import quests from backup
const backup: Quest[] = JSON.parse(backupData);
this.questService.importQuests(backup);

LocalStorage

The QuestService automatically persists all changes to localStorage under the key 'app_quests'.

Automatic saving: Every create, update, or delete operation saves to localStorage
Automatic loading: Quests are loaded from localStorage on service initialization
Date parsing: Dates (createdAt, updatedAt, completedAt) are automatically parsed when loading

No manual save/load needed - the service handles persistence automatically.

Complete Usage Example

import { Component, OnInit } from '@angular/core';
import { QuestService } from './services/quest.service';
import { Quest } from './common/models/quest.model';

@Component({
  selector: 'app-quest-manager',
  templateUrl: './quest-manager.component.html'
})
export class QuestManagerComponent implements OnInit {
  quests$ = this.questService.getQuests();
  stats$ = this.questService.getQuests().pipe(
    map(() => this.questService.getQuestStats())
  );

  constructor(private questService: QuestService) {}

  ngOnInit() {
    // Subscribe to quest changes
    this.quests$.subscribe(quests => {
      console.log('Current quests:', quests);
    });
  }

  createQuest() {
    this.questService.createQuest({
      title: 'New Quest',
      description: 'Quest description',
      category: 'dev',
      difficulty: 2,
      xpReward: 300,
      status: 'pending',
      icon: 'code',
      colorClass: 'realm-dev',
      glowClass: 'glow-dev',
      kingdom: 'Development',
      dueDate: '2024-12-31',
      reward: 'Skill boost',
      badges: [],
      tags: []
    });
  }

  completeQuest(id: string) {
    this.questService.completeQuest(id);
  }

  deleteQuest(id: string) {
    this.questService.deleteQuest(id);
  }

  searchQuests(term: string) {
    return this.questService.searchQuests(term);
  }
}

Quest Model

Quest interface definition

Category Service

Manage quest categories

Services

Models

​Overview

​Features

​Core Methods

​getQuests()

​Usage Example

​getAllQuests()

​Usage Example

​getQuestById()

​Usage Example

​createQuest()

​Usage Example

​updateQuest()

​Usage Example

​deleteQuest()

​Usage Example

​Status Management

​updateQuestStatus()

​completeQuest()

​Usage Example

​Filtering Methods

​getQuestsByCategory()

​getQuestsByStatus()

​Usage Example

​getQuestsByDifficulty()

​searchQuests()

​Usage Example

​Analytics

​getQuestStats()

​Usage Example

​Utility Methods

​clearAllQuests()

​importQuests()

​Usage Example

​LocalStorage

​Complete Usage Example

​Related

Quest Model

Category Service

Build docs developers (and LLMs) love

Overview

Features

Core Methods

getQuests()

Usage Example

getAllQuests()

Usage Example

getQuestById()

Usage Example

createQuest()

Usage Example

updateQuest()

Usage Example

deleteQuest()

Usage Example

Status Management

updateQuestStatus()

completeQuest()

Usage Example

Filtering Methods

getQuestsByCategory()

getQuestsByStatus()

Usage Example

getQuestsByDifficulty()

searchQuests()

Usage Example

Analytics

getQuestStats()

Usage Example

Utility Methods

clearAllQuests()

importQuests()

Usage Example

LocalStorage

Complete Usage Example

Related