1. Create the Page and Layout
Open UI Builder and navigate to your Portal experience.
Create a New Page: Name it "Cases" or "Case List."
Add a Layout: Use a "Main" container to hold your list. You might want a sidebar or a set of tabs at the top to toggle between the different views (All, My, Needs Action).
2. Configure Data Resources
To show cases, you need to "fetch" them from the server using a Data Resource.
In the bottom-left panel, click + Add under Data Resources.
Search for "Look up Records" or "Glide List".
Configure the Table: Set the table to sn_customerservice_case.
Apply Filters: This is where you differentiate the views:
My Cases: Filter where Contact is Dynamic: Me or Opened by is Dynamic: Me.
Needs Action: Filter where State is Awaiting Info or State is New.
All Cases: No specific user filter (usually filtered by the user's Account/Organization).
3. Add the "List" Component
Drag the List (or Simple List) component onto your page.
Bind the Data: In the component configuration, go to the Data property and use a "Data Pill" to point to your Data Resource (e.g., @data.look_up_records_1.results).
Set Columns: Select the fields you want to show (Number, Short Description, State, Updated).
4. Create "Needs Action" Logic
To make the "Needs Action" section interactive:
Use a Tabs component. Label the tabs "All," "My Cases," and "Needs Action."
Use Client State Parameters (e.g., selectedTab) to track which tab is active.
Set the Visibility of your List components based on that parameter, or update a single Data Resource's filter dynamically when the tab changes.
5. Add "Needs Action" Buttons (UI Actions)
To allow users to take action directly from the portal:
On your Record Page (the page the user sees after clicking a case), add Button components.
Event Mapping: Select the button and go to the Events tab. Add an event handler for "Button Clicked."
Link to Action: Choose the "Execute Server Script" or use a Data Resource like "Update Record" to change the case state (e.g., moving it from "Awaiting Info" back to "Open").
