bcgov
[Host Dashboard] - Host - high level view of applications (STRR Forms)
📖 User Story
As a host I want to see a high level view of my applications (STRR Forms) submitted So that I know what the status is and have the option to download a certificate or click and view my entire application (STRR Form)
Context:
STRRF= Short Term Rental Application Form (from a user perspective they will probably just call it an application. ) Hosts need to have a dashboard to manage their STRR Forms submitted, take actions and check status of each registration so they can have information needed to post their listings.
Designs: https://www.figma.com/design/R9GF5wvwq2TrnbnsbhPfvV/STR-Host-Application-Tickets?node-id=4029-3678&t=8mSxMG1YzK9TpPKn-4
📏 Business Rules
- [x] Hosts can create a brand new registration from the dashboard
- [x] Host can view all the STRR Forms submitted from the dashboard
- [ ] For each STRR Form submitted, host can see its status, option to download a certificate and option to view the registration details, property name and address
- [x] By default, once the STRR Form is completed, submitted and paid successfully, the status of the registration should be "Applied" for now
- [ ] if the host has never created an application then they are directed to a blank application and not the dashboard
- [ ] if certificate has not been issued then don't show the clickable link
- [x] Grouped by status and then by ordered by City/Location
- [x] If host has just one application, use the wide card (one card in one line, the bottom part of the design)
- [x] If host has more than one application, use the condensed version (three cards in one line)
🎭 Story Scenarios:
Scenario 1: Automatic first view - SBC Connect Account exists
- Given that I am authenticated by BC Services card, my session is active,
- And I have selected one of my SBC Accounts or created a new SBC Account
- Then I am presented with a new application not the dashboard
Scenario 2: Submitted Application
- Given that I am authenticated by BC Services card, my session is active,
- And I have selected one of my SBC Accounts
- Then I am presented with the "Dashboard" View
- And be presented with the ability to view all of the applications (STRR Forms) they have submitted
- And also the ability to click on a link to create a new application. (STRR Form)
Scenario 3: Details for each application
-
Given I have passed Scenario 2 and I am looking for information related to specific applications (STRR Forms)
-
Then I should see all of the applications (STRR Form) they have submitted
-
And each application (STRR Form) should display the following details/options:
- Rental Property Address:
- Property Name:
- Status: (Applied, Registered, Provisional, Cancelled, Suspended, Renewed, Expired - the list of status is subject to change) - default to Applied
- Download Certificate: (don't show if not available)
- View application details (clickable)
- Grouped by status and then by ordered by City/Location
🌐 Accessibility Scenarios
Keyboard Users
Scenario: Comprehensive Keyboard Navigation Given I am a keyboard user on the website When I use the Tab key to navigate through the website Then all interactive elements should be accessible and highlighted And I should be able to activate these elements using the Enter or Space key
Scenario: Full Content Accessibility via Keyboard Given I am a keyboard user navigating the website When I traverse through different pages and sections Then all content should be fully accessible using the keyboard alone And there should be no traps that prevent me from navigating away using the keyboard
Screen Reader Users
Scenario: Accessible Image Descriptions Given I am using a screen reader on the website When I encounter images Then each image should have descriptive alt text that conveys the same message as the image
Scenario: Structured Navigation for Screen Readers Given I am navigating the website using a screen reader When I move through different page elements Then the content should be structured with proper headings And the reading order should be logical and sequential
Scenario: Descriptive Form Fields Given I am filling out a form using a screen reader When I navigate through the form fields Then each field should be clearly labeled with descriptive text And instructions should be directly associated with their respective inputs
Low Vision Users
Scenario: Effective High Contrast Mode Given I am a user with low vision on the website When I enable high contrast mode Then all content should display with high color contrast suitable for low vision And the layout should remain coherent and unchanged
Scenario: Text Resizing Accommodation Given I am a user with low vision on the website When I increase the text size Then the text should resize without loss of information or functionality And the page layout should adapt accordingly without disrupting the user experience
Scenario: Personalized Styling Preferences Given I am a user with low vision adjusting settings on the website When I customize my styling preferences, including colors, fonts, and spacing Then these adjustments should be applied consistently across all pages And the changes should persist during my entire session or until altered by me
🌍 Global Scenarios
## Data Validation # Mikaela to confirm: Do we need to do these for MVP - data validation required for inputing data in the right format - as defined by business rules.Internet Connection
Standard Internet Connection
Given I am accessing the website from a standard internet connection When I navigate to any page on the site Then the page should load completely within 2 seconds, ensuring a fast and efficient user experience.
Low-Speed Internet
Given a user accesses "Application Details View" with a low-speed internet connection defined as under [specific speed] Mbps When the user attempts to load and interact with the dashboard page Then the "Application Details View" should prioritize critical content and functionality, loading essential elements first to ensure usability.
Mobile Responsiveness
Given I am accessing "Application Details View" on a mobile device When I click on the "any" link Then "_____ " should display correctly and be easily editable on my device, ensuring a responsive design.
@mbertucci @fionazhou-jsb First iteration is now here https://www.figma.com/design/R9GF5wvwq2TrnbnsbhPfvV/STR-Host-Application-Tickets?node-id=3995-5301&t=mVbjrmySUryFC5j8-0
@trevoratindustrio hey there you may want to make sub tasks for this story for backlog refinement tomorrow
@mbertucci This is now deployed to test - Link on the application submission page after registration submission will take you to this host dashboard view. cc @samIndustrio
@samIndustrio
Hey there.. I viewed the dashboard on my 32" screen and it has a bunch space between the cards and the "Create New Registration" button.
Otherwise it looks great
@mbertucci the page can be seen at this link on test: https://strr-ui-test.web.app/success/4
shows confirmation
@samIndustrio remaining issue is the spacing on large screen sizes or scaled screens?
Hey Sam @samIndustrio large screens.. there is too much space in between the cards on large screens. Can you also double check the spacing in the design and ensure the spacing is the same across all screen sizes? Thank you.
háy̓sxʷ q̓ə! (Thank you)
Mikaela Bertucci
Product Owner BC Registries and Online Serviceshttp://www.bcregistryservices.gov.bc.ca/
Service BC
Ministry of Citizens’ Services
T: 778 698-2675| Web: http://www.servicebc.gov.bc.cahttp://www.servicebc.gov.bc.ca/
“Access to government services made easy”
[cid:a1b150ee-fa5e-47aa-8a49-43440da46fd6]
From: trevoratindustrio @.> Sent: 26 June 2024 10:15 AM To: bcgov/entity @.> Cc: Bertucci, Mikaela CITZ:EX @.>; State change @.> Subject: Re: [bcgov/entity] [Host Dashboard] - Host - high level view of applications (STRR Forms) (Issue #21284)
[EXTERNAL] This email came from an external source. Only open attachments or links that you are expecting from a known sender.
@samIndustriohttps://github.com/samIndustrio remaining issue is the spacing on large screen sizes or scaled screens?
— Reply to this email directly, view it on GitHubhttps://github.com/bcgov/entity/issues/21284#issuecomment-2192243155, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ANF3VC3WBKSFIM2BZNRYHDDZJLZMNAVCNFSM6AAAAABHY5EXOWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCOJSGI2DGMJVGU. You are receiving this because you modified the open/close state.Message ID: @.***>
@Arash-IND @samIndustrio
- currently "download certificate" is displayed regardless if a certificate is issued or not. The requirement and business rules say show "Download certificate" when a certificate is issued.
- For Renewal button, we will not need it until the registration is about to expiry. I know we have it in design for the sake of demoing the future functionality.
renew button is removed (but has not been deployed to test yet) and download certificate button is showing when the certificate is issued. can close this ticket.