Dataford
Interview QuestionsInterview GuidesExperiencesCoaching
New
Pricing
Get started
Dataford
Popular roles
Software EngineerData AnalystData ScientistData EngineerBusiness AnalystAI EngineerMachine Learning EngineerProduct Manager
Browse
Browse All RolesEvery role hub, from analyst to MLBrowse All CompaniesCompany-specific interview loopsAll Interview GuidesThe full guide library
Top questions by role
Software EngineerData AnalystData ScientistData EngineerBusiness AnalystAI EngineerMachine Learning EngineerProduct Manager
Top questions by skill
SQLPythonStatisticsMachine LearningA/B TestingSystem DesignGenerative AIProduct SenseMetricsBehavioral
Browse all questions →Try a mock interview
Experiences
Practice
Mock InterviewsTimed interview simulations with feedbackCoaching1:1 coaching with people at your target companiesSuccess PathYour 6-week structured planModulesCurated lessons by topicWebinarsTalks from ex-Big Tech data leadsPlaygroundA free-form scratch editor
Learn
BlogInterview strategy and career adviceTech Job Market ReportHiring trends across data and AI rolesFor UniversitiesDataford for career centersAbout DatafordWho we are and how we build
Pricing
Build my plan
Managing UI State for Modals and Dropdowns
00:00
5 left

Managing UI State for Modals and Dropdowns

MediumSQL · PostgreSQL

Problem

How do you handle modal open and close, accordion, and dropdown state in a web app?

Use the provided user, component, and UI event tables to summarize each user's latest valid component state. Ignore invalid or NULL state events.

Output

  1. One row per user, including users without recorded events
  2. Columns: user_id, user_name, tracked_components, open_components, closed_components, modal_open, accordion_open, dropdown_open
  3. Sort by user_id ascending

Schema

app_users
ColumnTypeDescription
user_idPKINTUnique application user identifier
user_nameVARCHAR(100)Display name of the user
ui_components
ColumnTypeDescription
component_idPKINTUnique UI component identifier
component_nameVARCHAR(100)Displayed component name
component_typeVARCHAR(20)UI component type
ui_state_events
ColumnTypeDescription
event_idPKINTUnique state event identifier
user_idINTUser who generated the event
component_idINTComponent whose state changed
stateVARCHAR(10)Reported component state
event_atTIMESTAMPTZTimestamp when the state event occurred
Tablesapp_usersui_componentsui_state_events
Interviewer

Your question is Managing UI State for Modals and Dropdowns. Start with the requirements and the three tables in the Question tab.

Run and submit as often as you like. When you're ready, talk me through your approach or go straight to the code.

You need to log in / sign up to run or submit.
CodePostgreSQL
Sign up free to run your codeLog inLn 1
Run your query to see results here.