Let's make the server actions in account-actions.tsx work properly (version 3).

[bushwallyta271828]

TODO:

• Handle !response.ok everywhere.
• Get logOut to send a POST request to Django to end the session and delete all cookies.
• Figure out if I should delete the sessionID cookie whenever Django sends a 401 response.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create Delete Account button and rename Sign Up to Create Account.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Implement new backend views.
• Handle !response.ok everywhere.
• Get signOut to delete all cookies.
• Figure out if I should delete the sessionID cookie whenever Django sends a 401 response.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create Delete Account button.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Implement new backend views.
• Handle !response.ok everywhere.
• Get signOut to delete all cookies.
• Figure out if I should delete the sessionID cookie whenever Django sends a 401 response.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create Delete Account button and associated warning dialog.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Implement new backend views.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages.
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Get signOut, deleteAccount to delete all cookies.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create a warning dialog for the Delete Account button.
• Test everything!
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages.
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create a warning dialog for the Delete Account button.
• Test everything!
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages.
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create a warning dialog for the Delete Account button.
• Test everything!
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

Example response:

backend-1 | INFO: 172.23.0.5:53674 - "GET /users/authenticated HTTP/1.1" 200 OK backend-1 | INFO: 172.23.0.5:59244 - "POST /users/create-account HTTP/1.1" 201 Created backend-1 | INFO: 172.23.0.5:59244 - "GET /users/authenticated HTTP/1.1" 200 OK backend-1 | INFO: 172.23.0.5:59250 - "GET /users/authenticated HTTP/1.1" 200 OK backend-1 | INFO: 172.23.0.5:59254 - "POST /users/sign-out HTTP/1.1" 200 OK backend-1 | INFO: 172.23.0.5:59254 - "GET /users/authenticated HTTP/1.1" 200 OK frontend-1 | tA [Error]: Cookies can only be modified in a Server Action or Route Handler. Read more: https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options frontend-1 | at Proxy.callable (/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:13:12752) frontend-1 | at o (/.next/server/chunks/585.js:1:9509) frontend-1 | at process.processTicksAndRejections (node:internal/process/task_queues:95:5) backend-1 | INFO: 172.23.0.5:59262 - "GET /users/authenticated HTTP/1.1" 200 OK frontend-1 | tA [Error]: Cookies can only be modified in a Server Action or Route Handler. Read more: https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options frontend-1 | at Proxy.callable (/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:13:12752) frontend-1 | at o (/.next/server/chunks/585.js:1:9509) frontend-1 | at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

[bushwallyta271828]

Apparently you can't call a Server Action from a server-rendered component? Okay, time for some changes... (source: https://github.com/vercel/next.js/issues/51875)

[bushwallyta271828]

TODO:

• Make sure I never call a server action from a server-rendered component.
• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages (maybe using .bind to attach setError functions?).
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create a warning dialog for the Delete Account button.
• Test everything!
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Fix bug where Account doesn't update authentication state correctly.
• Make sure I never call a server action from a server-rendered component.
• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages (maybe using .bind to attach setError functions?).
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Figure out why a 401 error on initial render is causing the page to not display.
• Create a warning dialog for the Delete Account button.
• Test everything!
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

At the expense of Account not updating correctly, I think I've fixed the "Cookies can only be modified in a Server Action or Route Handler" bug.

[bushwallyta271828]

TODO:

• Fix bug where Account doesn't update authentication state correctly.
• Make sure I never call a server action from a server-rendered component.
• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages (maybe using .bind to attach setError functions?).
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Handle !response.ok everywhere.
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Make sure that all updates to fetched data either occur on page changes or with manual re-fetching.
• Make sure I never call a server action from a server-rendered component.
• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors in account/ pages (maybe using .bind to attach setError functions?).
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

The one time when the Account button might not refresh is when we get a 401 response from a timed-out session while performing an unrelated fetch request. Other than that, all other ways in which the authentication state could change (sign in, create account, sign out, delete account) should result in page redirects.

One option is for fetchWrapper to redirect to the sign-in page whenever it gets a 401 error. I would have to think that through and make sure that there are no unintended consequences to that decision, however.

[bushwallyta271828]

Oh, I just realized: since isAuthenticated doesn't return a 401 error, deleting sessionid cookies on 401 returns won't exactly delete sessionid cookies whenever we know that they should be deleted.

isAuthenticated is also different in that it is the only function whose value directly informs the AccountButton display. Maybe isAuthenticated can be treated as a unique view, i.e. it is the only view that provides information on authentication state where an authentication error doesn't return a 401 status.

[bushwallyta271828]

Okay, here's the plan:

There are three pieces of information that I need to worry about staying updated for account / homepage purposes: the authentication state as needed in AccountButton, the debate name as needed in DebateName, and the username/email as needed in the Change Account page.

For the authentication state of AccountButton, there are five ways it should change: during sign up, during account creation, during sign out, during account deletion, and from any backend responses that indicate that the user is signed out. The first four ways all involve page redirects when successful, and since AccountButton lives inside a template it will refresh accordingly (CONSTRAINT: ALL FOUR OF THESE ACTIONS MUST HAVE REDIRECTS OR REVALIDATES!). As for backend responses, there are two sub-cases: isAuthenticated and everything else. isAuthenticated gets called by AccountButton itself, and so long as isAuthenticated only gets called by AccountButton, we're safe (CONSTRAINT: isAuthenticated CAN ONLY BE CALLED BY AccountButton AND THE AUTHORIZATION VIEW SHOULD ONLY BE CALLED BY isAuthenticated!). As for everything else, every other action that checks for authentication should return a 401 response when the user is not authenticated (CONSTRAINT: ALL OTHER VIEWS THAT RETURN INFORMATION ABOUT USER AUTHENTICATION SHOULD DO SO BY RETURNING 401). Then the fetchWrapper function can check for 401 responses and redirect to the sign-in page automatically, hence refreshing AccountButton (CONSTRAINT: fetchWrapper MUST REDIRECT / REVALIDATE WHEN GETTING A 401 STATUS). That should cover everything.

For the debate name, that can only get changed when in the debates view, so it will only need to be checked on page redirects (CONSTRAINT: DEBATE NAMES CANNOT BE CHANGED WITHIN THE DEBATE). Since DebateName is on a template, it should update correctly.

Lastly, for username/email in the Change Account page, this information gets updated after page load when the various Change forms are called. Since this information will be displayed inside a Client Component, I can use state variables inside the Client Component to keep track of the username and email and update them if form submission is successful.

[bushwallyta271828]

TODO:

• Implement the authentication-state constraints in the big comment above.
• Implement the username-email-state constraints in the big comment above.
• Make sure I never call a server action from a server-rendered component.
• Remove any 'use server' commands that turn out to be unnecessary.
• Have fetchWrapper return a response object with an error code and message rather than throwing errors. Alternatively, have fetchWrapper either return a string error message or the response data.
• Make account/ pages use client components for error displays.
• Display errors (including from submitSignInForm parsing) in account/ pages (maybe using .bind to attach setError functions?).
• Make fetchWrapper automatically delete the sessionid cookie if the response status is 401.
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.
• Test everything!

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

I'm encountering a bizarre bug where changing the password (not the username or email) will automatically delete the sessionid cookie. I'm not getting a 401 response either.

[bushwallyta271828]

TODO:

• Get the error message displays to not include {"message": (actual message)}
• Figure out how forms should be handled with autocomplete, required, etc.
• Display success message on password change (since the user currently doesn't get any confirmation).
• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Make sure I never call a server action from a server-rendered component.
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Make the manage-account page look a bit better (I don't know why it just looks wrong)
• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right
• Make the errors meaningful and good to display
• Duplicate password box on create account / manage account
• Display success message on password change (since the user currently doesn't get any confirmation).
• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right
• Make the errors meaningful and good to display
• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Create a warning dialog for the Delete Account button.
• Check that all of my status codes look reasonable.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.

[bushwallyta271828]

TODO:

• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• Create a warning dialog for the Delete Account button.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.
• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right

[bushwallyta271828]

TODO:

• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out if I need to insert a bunch of "await" commands throughout my entire codebase to prevent subtle bugs in the future.
• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right
• Figure out why the rectangular shadow on the claim box is wrong (I thought I fixed that...)
• Make the syntax box on constraint claims flat at the top (I thought this looked good but now I've changed my mind)

[bushwallyta271828]

TODO:

• Write down / formalize how I'm managing account state, cookies, and redirects/refreshes in the Issue.
• For the backend, maybe create a custom decorator for my standard authentication if/else.

TODO for future branches:

• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right
• Figure out why the rectangular shadow on the claim box is wrong (I thought I fixed that...)
• Make the syntax box on constraint claims flat at the top (I thought this looked good but now I've changed my mind)

[bushwallyta271828]

TODO for future branches:

• Figure out how DebateName will update inside a layout instead of a template (do I need to revert?)
• Figure out if the debate name can be made to truncate and shrink for smaller window widths rather than cutting off the links on the right
• Figure out why the rectangular shadow on the claim box is wrong (I thought I fixed that...)
• Make the syntax box on constraint claims flat at the top (I thought this looked good but now I've changed my mind)
• Write down / formalize how I'm managing account state, cookies, redirects/refreshes, error messages / responses, and debate name information in the Issue.