Skip to main content

​
Overview

The Category interface defines the structure for quest categories in the Tareas application. Categories help organize quests into themed groups with distinct visual styling.

​
TypeScript Interface

export interface Category {
  id: string;
  key: 'design' | 'dev' | 'marketing' | 'primary' | 'innovation' | 'strategy' | 'heal' | 'study' | 'funny';
  name: string;
  colorClass: string;
  icon: string;
}

​
Fields

​
id
string
required
Unique identifier for the category
​
key
'design' | 'dev' | 'marketing' | 'primary' | 'innovation' | 'strategy' | 'heal' | 'study' | 'funny'
required
Programmatic key used to reference the category. Must be one of the predefined values:
  • design: Creative and design-related tasks
  • dev: Development and programming tasks
  • marketing: Marketing and promotional activities
  • primary: Primary or essential tasks
  • innovation: Innovation and R&D activities
  • strategy: Strategic planning tasks
  • heal: Health and wellness activities
  • study: Learning and educational tasks
  • funny: Fun or recreational activities
​
name
string
required
Human-readable display name for the category
​
colorClass
string
required
CSS class name that defines the color theme for this category
​
icon
string
required
Icon identifier or name used to visually represent the category

​
Category Keys Explained

​
design

For creative tasks including UI/UX design, graphic design, and visual content creation.

​
dev

For software development tasks including coding, debugging, and technical implementation.

​
marketing

For marketing activities including campaigns, content marketing, and brand promotion.

​
primary

For high-priority or essential tasks that don’t fit other categories.

​
innovation

For research, experimentation, and innovative projects.

​
strategy

For strategic planning, business analysis, and long-term planning tasks.

​
heal

For health, wellness, and self-care activities.

​
study

For learning, training, and educational pursuits.

​
funny

For entertainment, team building, and fun activities.

​
Usage Example

const category: Category = {
  id: 'cat-001',
  key: 'design',
  name: 'Design',
  colorClass: 'category-purple',
  icon: 'brush-outline'
};

const devCategory: Category = {
  id: 'cat-002',
  key: 'dev',
  name: 'Development',
  colorClass: 'category-blue',
  icon: 'code-slash-outline'
};
  • Quest Model - Uses category field to link to a Category

Build docs developers (and LLMs) love

Get started for freeTalk to us