Feature/recipe items #122
Feature/recipe items #122
Conversation
Coverage Report
File Coverage
|
||||||||||||||||||||||||||||||||||||||||||||
There was a problem hiding this comment.
Pull Request Overview
This PR introduces a new tree-based visualization for displaying recipe data by replacing the previous JSON viewer with a structured hierarchical display using Ant Design components.
Key Changes:
- Replaced the collapsible JSON text viewer with a combination of Descriptions and Tree components from Ant Design
- Added utility functions for formatting arrays, converting underscores to spaces, and handling null values
- Removed the editable text area functionality in favor of read-only structured display
Reviewed Changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/components/JSONViewer/index.tsx | Replaced Collapse/Input components with Descriptions and Tree components to display recipe data hierarchically |
| src/components/JSONViewer/style.css | Updated styles to support the new tree-based layout with descriptions and tree titles |
| src/components/JSONViewer/formattingUtils.tsx | Added new utility functions for formatting arrays, converting underscores, and rendering key-value pairs |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
|
| Object.entries(contentAsObj).forEach(([key, value]) => { | ||
| if (typeof value === "string") { | ||
| descriptions.push({ | ||
| label: convertUnderscoreToSpace(key), | ||
| children: <>{value}</>, | ||
| }); | ||
| } else if (Array.isArray(value)) { | ||
| descriptions.push({ | ||
| label: convertUnderscoreToSpace(key), | ||
| children: <>{formatArray(value)}</>, | ||
| }); |
There was a problem hiding this comment.
Love the clean format! just one note: Endosome is missing the display for "randomness_seed": 742470, We should also add handling for value === "number" in the top level descriptions.
There was a problem hiding this comment.
I added check for number but I don't see the randomness seed still (I logged all the key value pairs)
There was a problem hiding this comment.
ah sorry, just checked firebase and looks like it’s actually a bug in the upload script. Frontend should be fine now. We’ll be able to display all data once this backend upload bug is fixed.
Problem
closes #119
Solution
used a tree structure to show nested items
Type of change
Please delete options that are not relevant.
Steps to Verify:
Screenshots (optional):