Criando seu Primeiro Addon

Guia prático e passo a passo para criar, configurar e testar seu primeiro Addon utilizando o SDK do Pandhora.

Criando seu Primeiro Addon

Neste guia prático, você aprenderá a construir um Addon completo para o Pandhora do zero utilizando TypeScript e o pacote oficial @pandhora/sdk.


1. Configurando o Projeto

Crie um novo diretório para o seu plugin e inicialize o projeto com suas dependências:

mkdir pandhora-meu-addon
cd pandhora-meu-addon
npm init -y
npm install @pandhora/sdk
npm install -D typescript tsup @types/node

Configure o arquivo tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "declaration": true,
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  }
}

2. Estrutura do Addon

Todo addon do Pandhora exporta como default uma classe que implementa o contrato IAddon.

Crie o arquivo src/index.ts:

import type { IAddon, AddonContext, AddonSettingsField } from '@pandhora/sdk'

export default class MeuPrimeiroAddon implements IAddon {
  // Metadados obrigatórios do Addon
  public id = 'meu-primeiro-addon'
  public name = 'Meu Primeiro Addon'
  public version = '1.0.0'
  public description = 'Exemplo prático de extensão para o Pandhora'
  public author = 'Seu Nome ou Empresa'

  private context?: AddonContext

  // Formulário de preferências renderizado automaticamente na interface do Pandhora
  public settingsFields: AddonSettingsField[] = [
    {
      key: 'servidorUrl',
      label: 'URL do Servidor',
      type: 'text',
      required: true,
      description: 'Endereço da API ou instância corporativa.',
    },
    {
      key: 'apiKey',
      label: 'Chave de Acesso / Token',
      type: 'password',
      required: true,
      description:
        'Token de autenticação gerado nas preferências da sua conta.',
    },
    {
      key: 'notificarEventos',
      label: 'Exibir Notificações Nativas',
      type: 'boolean',
      defaultValue: true,
    },
  ]

  // Ciclo de Vida: Executado quando o plugin é ativado no Pandhora
  public async onActivate(context: AddonContext): Promise<void> {
    this.context = context
    console.log(`[${this.name}] Addon ativado com sucesso!`)

    // Lendo valores salvos com segurança no storage do Workspace
    const servidorUrl = await context.storage.get('servidorUrl')
    const notificar = (await context.storage.get('notificarEventos')) === 'true'

    if (notificar) {
      await context.notifications.show({
        title: 'Addon Ativado',
        body: `Conectado ao Pandhora com sucesso!`,
      })
    }

    // Escutando eventos do cronômetro em tempo real
    context.events.onTimerStart((data) => {
      console.log(`[${this.name}] Timer iniciado para a tarefa:`, data.taskId)
    })

    context.events.onTimerStop((data) => {
      console.log(
        `[${this.name}] Timer finalizado. Tempo registrado:`,
        data.durationSeconds,
      )
    })
  }

  // Ciclo de Vida: Executado ao desativar o plugin ou trocar de Workspace
  public async onDeactivate(): Promise<void> {
    console.log(`[${this.name}] Addon desativado. Limpando recursos...`)
    this.context = undefined
  }
}

3. Configurações Dinâmicas (settingsFields)

A propriedade settingsFields permite que seu plugin defina formulários de configuração sem escrever uma única linha de interface gráfica (UI). O Pandhora gera e valida os campos nativamente.

Tipos de Campos Suportados:

  • text: Entrada de texto comum.
  • password: Campo com máscara de segurança para tokens, senhas e API keys.
  • boolean: Interruptor (Toggle) de verdadeiro/falso.
  • select: Lista suspensa de opções personalizadas com pares { label, value }.

4. O Contexto do Addon (AddonContext)

Ao ser ativado, o Pandhora injeta o objeto AddonContext contendo todas as APIs e ferramentas disponíveis:

PropriedadeDescrição
context.storageArmazenamento chave-valor criptografado e isolado por Workspace.
context.eventsEventos em tempo real do sistema (início/fim de timer, idle, troca de workspace).
context.notificationsEmissão de notificações nativas no sistema operacional.
context.timerLeitura e controle do cronômetro ativo.
context.oauthFluxo de autenticação OAuth 2.0 PKCE seguro sem necessidade de secrets.

5. Compilando o Addon

Adicione o script de build ao seu package.json:

{
  "scripts": {
    "build": "tsup src/index.ts --format esm,cjs --dts --clean"
  }
}

Execute a compilação:

npm run build

O arquivo compilado resultante pode ser importado diretamente nas configurações de Addons do Pandhora.