{"id":25859715,"url":"https://github.com/wptk/yarniverse-explorer","last_synced_at":"2026-04-15T13:31:30.944Z","repository":{"id":280035091,"uuid":"940673258","full_name":"WPTK/yarniverse-explorer","owner":"WPTK","description":"The Yarniverse Explorer is a web application designed to help users visualize and manage their yarn collections. It reads data from a CSV file stored locally and presents it in a user-friendly interface. The app offers features such as multi-select filters, sorting, and search functionality across various data points.","archived":false,"fork":false,"pushed_at":"2025-02-28T20:56:59.000Z","size":494,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-28T23:41:45.862Z","etag":null,"topics":["crochet","css","data-visualization","lovable-dev","tracking","typescript","webapp","yarn"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/WPTK.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-02-28T15:35:51.000Z","updated_at":"2025-02-28T20:57:03.000Z","dependencies_parsed_at":"2025-02-28T23:42:20.730Z","dependency_job_id":"9fa90eb2-d4ff-426f-ba34-92646c152b92","html_url":"https://github.com/WPTK/yarniverse-explorer","commit_stats":null,"previous_names":["wptk/yarniverse-explorer"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WPTK%2Fyarniverse-explorer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WPTK%2Fyarniverse-explorer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WPTK%2Fyarniverse-explorer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/WPTK%2Fyarniverse-explorer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/WPTK","download_url":"https://codeload.github.com/WPTK/yarniverse-explorer/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241430299,"owners_count":19961633,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["crochet","css","data-visualization","lovable-dev","tracking","typescript","webapp","yarn"],"created_at":"2025-03-01T21:43:12.861Z","updated_at":"2026-04-15T13:31:30.891Z","avatar_url":"https://github.com/WPTK.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# Yarniverse Explorer\n\nA modern, responsive web application for visualizing and exploring your yarn collection.\n\n## Features\n\n- **Interactive Data Views**: Toggle between table and grid views\n- **Powerful Filtering**: Filter by brand, weight, colors, and more\n- **Modern Visualizations**: Automatically generated charts and graphs\n- **Summary Statistics**: Quick overview of your collection\n- **Saved Views**: Save your filter combinations for quick access\n- **Infinite Scroll**: Smooth loading for large collections\n- **Dark Mode**: Toggle between light and dark themes\n- **Fully Responsive**: Works on desktop and mobile devices\n\n## Setup Instructions\n\n### 1. CSV File Configuration\n\nThe app reads yarn data from a CSV file stored at `/public/data/yarn-collection.csv`. The file should have the following columns:\n\n```\nBrand,Sub-brand,Length (yards),Multicolor,Weight,Rows,Color 1,Color 2,Color 3\n```\n\nExample row:\n```\nLion Brand,Wool-Ease,197,No,Medium,28,Navy Blue,,\n```\n\n### 2. Customizing CSV Column Names\n\nIf you need to change the CSV column names or structure, you can update the mapping in the file:\n\n`src/services/csv-service.ts`\n\nLook for the `CSV_COLUMN_MAPPING` object and update the property values to match your CSV headers:\n\n```typescript\nconst CSV_COLUMN_MAPPING = {\n  brand: \"Brand\",                // Your CSV header for brand\n  subBrand: \"Sub-brand\",         // Your CSV header for sub-brand\n  length: \"Length (yards)\",      // Your CSV header for length\n  multicolor: \"Multicolor\",      // Your CSV header for multicolor flag\n  weight: \"Weight\",              // Your CSV header for weight\n  rows: \"Rows\",                  // Your CSV header for rows\n  color1: \"Color 1\",             // Your CSV header for first color\n  color2: \"Color 2\",             // Your CSV header for second color\n  color3: \"Color 3\",             // Your CSV header for third color\n};\n```\n\n### 3. Working with Colors\n\nThe app automatically categorizes colors into color groups based on common color names. If you want to add more color names or modify existing ones, you can update:\n\n`src/utils/color-utils.ts`\n\n## Usage\n\n### Filtering\n\n- Use the filters panel on the left to filter your yarn collection\n- Multiple filters can be combined\n- Click \"Reset\" to clear all filters at once\n\n### Sorting (Table View)\n\n- Click on column headers to sort the data\n- Click again to toggle between ascending and descending order\n\n### Saving Views\n\n- Click \"Save Current View\" to save your current filter configuration\n- Enter a name for your view\n- Access saved views from the Saved Views panel\n\n### Switching Between Views\n\n- Use the table/grid toggle at the top right of the data panel\n\n## Project Structure\n\n- `/src/components`: UI components\n- `/src/contexts`: Data contexts (yarn data provider)\n- `/src/services`: Services for data loading and processing\n- `/src/utils`: Utility functions for colors, statistics, etc.\n- `/src/types`: TypeScript type definitions\n- `/public/data`: Location for the CSV data file\n\n## Feedback and Issues\n\nIf you encounter any issues or have feedback, please submit it to the project repository.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwptk%2Fyarniverse-explorer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwptk%2Fyarniverse-explorer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwptk%2Fyarniverse-explorer/lists"}