refactor: merge authSession function into useSession hook

[babblebey]

Description

This pull request refactors the useSession hook and incorporates (and deprecates) the functionality of the deprecated authSession function, resulting in an improved and more organized approach to handle session-related data and authentication.

Changes Made

1. Merged the logic from the deprecated authSession function into the useSession hook to consolidate related functionalities and enhance code maintainability.
2. Replaced the use of the authSession function with the new loadSession function, which performs the same session data retrieval from the backend API, and made the function available as a returned value under the same authSession name making it accessible to users if needed.
3. Separated the state management for session data and the store update logic into two distinct functions: loadSession and setStoreData.
4. The loadSession function now handles the API call to fetch session data and returns the parsed data when the response is successful. In case of an error, it returns false.
5. The setStoreData function is responsible for updating the store state with the obtained session data, keeping the code more modular and readable.
6. Added deprecation notice inside the authSession function stating its migration to the useSession hook.
7. Updated the usage of the authSession with the useSession in the codebase.

What type of PR is this? (check all applicable)

• 🍕 Feature
• 🐛 Bug Fix
• 📝 Documentation Update
• 🎨 Style
• 🧑‍💻 Code Refactor
• 🔥 Performance Improvements
• ✅ Test
• 🤖 Build
• 🔁 CI
• 📦 Chore (Release)
• ⏩ Revert

Related Tickets & Documents

Fixes #1169

Mobile & Desktop Screenshots/Recordings

Added tests?

• 👍 yes
• 🙅 no, because they aren't needed
• 🙋 no, because I need help

Added to documentation?

• 📜 README.md
• 📓 docs.opensauced.pizza
• 🍕 dev.to/opensauced
• 📕 storybook
• 🙅 no documentation needed

[optional] Are there any post-deployment tasks we need to perform?

[optional] What gif best describes this PR or how it makes you feel?

[netlify]

✅ Deploy Preview for design-insights ready!

Name	Link
🔨 Latest commit	31add71
🔍 Latest deploy log	https://app.netlify.com/sites/design-insights/deploys/64c02e996e53000008427c5f
😎 Deploy Preview	https://deploy-preview-1391--design-insights.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for oss-insights ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	31add71
🔍 Latest deploy log	https://app.netlify.com/sites/oss-insights/deploys/64c02e99704709000857f4d7
😎 Deploy Preview	https://deploy-preview-1391--oss-insights.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[brandonroberts]

@babblebey maybe I miscommunicated the intent here. There should only be the useSession hook. authSession should not be exported publicly. The hook should make the request where needed to initiate the session, and return the properties from the store to be consumed.

[babblebey]

Done @brandonroberts

I had few ideas to approach this in mind but here's what I settled for...

Return a local session state value from the useSession hook in place of the authSession

This approach means that we'll keep/manage a local state session within the useSession hook, this session state value will be set on receipt of response from the /auth/session endpoint and then it is returned alongside the store managed properties (i.e. onboarded, waitlisted & hasReports)

const useSession = (getSession = false) => {
  //...
  const [session, setSession] = useState(); // <- Initialising State 🍕

  useEffect(() => {
    (async () => {
      if (sessionToken && getSession) {
        const data = await loadSession();
        setSession(data); // <- Setting the State 🍕
        setStoreData(...);
      }
    })();
  }, [sessionToken]);

  return { 
    onboarded, 
    waitlisted, 
    hasReports, 
    session // <- Returned State 🍕
  };
};

With this approach, It means we

• can re-fetch session from the /auth/session endpoint and destructure its response as session state value every time we call useSession with the getSession argument set to true without an Initial value retrieved from anywhere or newly set value saved anywhere outside the useSession hook.

const { session } = useSession(true)

• retain the the ability to really not get any session data when getSession is kept at default false, and we are still able to retrieve the store saved properties (i.e. onboarded, waitlisted & hasReports), these values are already initialised in the _app.tsx component.

• simply use the destructured session state value from useSession(true) in any component we wish to integrate it.
  Usage in AuthSection component

// components\molecules\AuthSection\auth-section.tsx

const { onboarded, session } = useSession(true);

useEffect(() => {
  const getUser = async () => {
    if (session && !userInfo) {
      setUserInfo(session);
    }
  };

  getUser();
}, [userInfo]);

Like so 🍕

[brandonroberts]

@babblebey changes look good thanks. After the merge conflicts are resolved, its good to go

[babblebey]

Phew 🍕

[github-actions]

🎉 This PR is included in version 1.57.1-beta.6 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[github-actions]

🎉 This PR is included in version 1.58.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀