Skip to content

fix: keep location selection text unchanged during loading #138

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from

Conversation

KentShikama
Copy link
Member

Fixes #134

This PR refines the previous fix for the location selection text flashing issue. Instead of showing different text during loading, the text now remains unchanged until the chat initialization is complete.

Changes

  • Added isLoading state to track chat initialization
  • Updated text rendering logic to prevent flash during loading
  • Text remains as welcome message during loading state
  • Only shows different text after loading completes

How It Works

  1. Initial: Shows welcome message
  2. User selects city: isLoading becomes true, text stays unchanged
  3. After chat loads: isLoading becomes false, shows appropriate message

This eliminates the visual flash that occurred when text changed immediately upon city selection.

Generated with Claude Code

- Add isLoading state to track chat initialization
- Update text rendering logic to prevent flashing 
- Text remains as welcome message during loading state
- Only shows different text after loading completes

Co-authored-by: Kent Shikama <KentShikama@users.noreply.github.com>
@leekahung
Copy link
Contributor

The version here seems to keep getting stuck at the welcome message.

Screen.Recording.2025-06-19.at.9.47.47.PM.mov

@@ -30,10 +30,12 @@ interface Props {

export default function CitySelectField({ setMessages }: Props) {
const [city, setCity] = useState<string | null>(null);
const [isLoading, setIsLoading] = useState(false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Think I've got a fix.

Instead of calling another state, we can define selectedCity outside handleCityChange. Something like:

const selectedCity = city
    ? CitySelectOptions[city as keyof typeof CitySelectOptions]
    : null;

Which keeps selectedCity null until city changes from setCity.

We can keep Line 39, but change it to a different name like selected to avoid clashing with selectedCity.

We could then switch up the condition in Line 67 to selectedCity === null || selectedCity.state given we switch up the order of the ternary:

{selectedCity === null || selectedCity.state
      ? "Welcome to Tenant First Aid! I can answer your questions about tenant rights in Oregon. To get started, what city are you located in."
      : "Unfortunately we can only answer questions about tenant rights in Oregon right now."}
Screen.Recording.2025-06-19.at.10.43.13.PM.mov

This should patch things up.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah good catch!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would #139 work? I gave it a test and it seems to. I'm not sure if I'm missing some nuance though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Location selection flashing wrong text for a split second before moving into chat
2 participants