Timeline - Familiar Library Browser Plugin

A library browser plugin for Familiar that visualizes your music collection by release year.

Features

• Interactive timeline visualization
• Bar chart showing tracks per year
• Decade quick-select buttons
• Hover tooltips with track/album/artist counts
• Click to filter library by year

Installation

In Familiar:

1. Go to Settings > Plugins
2. Enter this repository URL: https://github.com/seethroughlab/familiar-plugin-timeline
3. Click Install

Development

# Install dependencies
npm install

# Build the plugin
npm run build

# Watch for changes during development
npm run watch

API Usage

This plugin demonstrates the Familiar Browser API:

// Access the global API
const { React, registerBrowser, useQuery, api } = window.Familiar;

// Query hook for data fetching
const { data, isLoading, error } = useQuery({
  queryKey: ['library-year-distribution'],
  queryFn: () => api.library.getYearDistribution(),
});

// Register the browser
registerBrowser(metadata, Component);

Browser Props

interface BrowserProps {
  onGoToYear: (year: number) => void;
  onGoToYearRange: (startYear: number, endYear: number) => void;
}

License

MIT