Skip to content

feat: add canvas paintaings to media dialog#38

Merged
charlesLoder merged 4 commits intomainfrom
canvas-images
Sep 5, 2025
Merged

feat: add canvas paintaings to media dialog#38
charlesLoder merged 4 commits intomainfrom
canvas-images

Conversation

@charlesLoder
Copy link
Owner

The PR:

  • adds the representative Canvas images to the MediaDialog component
  • makes use of the Traverse class to find items more succinctly

@charlesLoder charlesLoder requested a review from Copilot September 5, 2025 20:02
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR adds canvas painting images to the MediaDialog component and refactors the codebase to use the Traverse class for more efficient IIIF resource navigation.

  • Implements IIIF Image Request URI utilities for dynamic image sizing
  • Refactors MediaDialog to use Traverse class for finding canvas items
  • Adds canvas paintings as selectable media alongside existing thumbnails and placeholders

Reviewed Changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
src/plugin/utils/index.ts Adds IIIF Image Request URI types and utility functions, updates getLabelByUserLanguage signature
src/plugin/Panel/index.tsx Updates manifest label handling to be more defensive
src/plugin/Panel/index.test.tsx Adds serialize mock for Canvas type in test setup
src/plugin/Panel/MediaDialog/style.module.css Adds flex-wrap to content layout and removes commented code
src/plugin/Panel/MediaDialog/index.tsx Major refactor to use Traverse class and add canvas paintings support

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

width: resource?.width || 0,
};
}

Copy link

Copilot AI Sep 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The JSDoc example has a malformed code block - it should end with three backticks instead of two.

Copilot uses AI. Check for mistakes.
Comment on lines +157 to +158
// @ts-expect-error - I don't want to go down the rabbit hole of type checking here
const label = getLabelByUserLanguage(painting?.label);
Copy link

Copilot AI Sep 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using @ts-expect-error to bypass type checking makes the code fragile. Consider casting to the correct type or handling the type mismatch properly to maintain type safety.

Suggested change
// @ts-expect-error - I don't want to go down the rabbit hole of type checking here
const label = getLabelByUserLanguage(painting?.label);
// Ensure painting.label is of the expected type for getLabelByUserLanguage
const label = getLabelByUserLanguage(
painting && painting.label
? (painting.label as Parameters<typeof getLabelByUserLanguage>[0])
: []
);

Copilot uses AI. Check for mistakes.
Comment on lines 271 to 274
Copy link

Copilot AI Sep 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using array index as React key is an anti-pattern that can cause rendering issues. Use a unique, stable identifier like thumbnail-${thumbnail.id} instead.

Copilot uses AI. Check for mistakes.
@charlesLoder charlesLoder merged commit f634f5e into main Sep 5, 2025
3 checks passed
@charlesLoder charlesLoder deleted the canvas-images branch September 5, 2025 20:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant

Comments