Fix re-rendering of joules in conversation view

[abhi12299]

What?

Fixes re-rendering of joules in the conversation view. Refer:

fix.mp4

How?

By storing joules in a separate state variable, independent from the current task, we fix the re-rendering issue.

Note:
This is meant as a quick fix for this issue. Ideally, the electron process should not send the entire dehydrated task every time a token is received from claude. This is because most of the task still remains the same - only the last joule changes. But implementing that will require a significant change in the codebase and also in the #30 PR.

That is why this PR addresses the primary issue of constant renders of previous joules. Sending the entire task while streaming is another issue, which I will work on in a different PR, and after #30 gets merged.

[jacksondc]

We sometimes do remove joules (if an error occurs), and I'm planning to implement undo/edit at some point in the future. I assume that would pose a problem for this solution?

I wonder if there's a way to re-render smartly based on the joule's id...

Ideally, the electron process should not send the entire dehydrated task every time a token is received from claude

Absolutely. If there's a way we can address this without adding too much code complexity I'm all for it. Otherwise I'd rather just pay the performance cost for now.

[abhi12299]

@jacksondc made a few changes - if the number of joules we have is less than what is sent over (for example when merging joules in case of error), we simply overwrite the local state. As for undo, we will receive lesser number of joules and this simple overwrite will work.

Regarding edit, this is my suggestion:

• Once edits are made, create a new id for the joule and update it in the conversation
• Send a separate RPC to the renderer with the following data: spliceIndex and editedJoule.
• The frontend will perform the necessary steps to update the joule and since the id changes, react will trigger a re-render for that component.
• Since we will most likely redo the API call on edit, we can also remove any joules that come after the spliceIndex and continue to re-render the UI based on the current logic

If there's a way we can address this without adding too much code complexity I'm all for it

I think this will need a significant change, which will most likely introduce a few more RPC calls between the frontend and the main process to allow proper syncing of the state between the two. Here are a few RPCs that I think will need to be added/updated:

• Update the getActiveTask RPC to only return the task without the conversation
• Create a getConversation RPC to return the entire conversation currently (will be called when loading the conversation initially)
• Create a streamJoule RPC to return the streamed joule from claude
• Create a spliceJoule RPC to return the joule to remove from the frontend in case of any merges/undos/edits

[jacksondc]

I think I've fixed this with #80. If I've missed something let me know!