diff --git a/stage.yml b/stage.yml new file mode 100644 index 0000000..e6925bc --- /dev/null +++ b/stage.yml @@ -0,0 +1,60 @@ +id: stage +type: PageSiderMenu +properties: + title: Stage + +areas: + content: + blocks: + - id: title + type: Title + layout: + grow: 1 + properties: + content: Stage + - id: new_brand_button # Create a Button block to add a new brand. + type: Button + layout: + grow: 0 # Because the grow of the button is 0, it will not expand but remain in the same row as the title block. + properties: + title: New Brand # Button text. + icon: PlusOutlined # Ant Design icon on the button. + events: + onClick: # All the actions to complete when the button is clicked. + - id: link_to_new_brand # Link to the page where we will add a new brand. + type: Link + params: + pageId: new-brand # The page id of the new brand page. + # A List block to render the following brands. + # The list block will render a content area all items in the "brands_list" array in state. + # The "brands_list" array is populated by the "set_brands" onEnter action. + - id: brands_list + type: List + blocks: + - id: brands_list.$.container # Wrap all the blocks for a brands item in a box. + type: Box + style: + background: '#fff' # Give the box a white background and some spacing. + margin: 10 + padding: 10 + blocks: + - id: brands_list.$.name # Show the item name as a title in the list. + type: Title + properties: + content: + _state: brands_list.$.name + level: 3 + - id: brands_list.$.description # Show the item description as a paragraph in the list. + type: Paragraph + properties: + content: + _state: brands_list.$.description + events: + onClick: + - id: link_to_edit_brand # Link to the page where we will edit the clicked brand. + type: Link + params: + pageId: edit-brand # The page id of the edit brand page. + urlQuery: + brand_id: + _state: brands_list.$._id # Set the brand_id in the url query on the edit-brand page to the _id field of the clicked list item.