React Query Set Up

[StacL]

This closes #46

Description / Changes Made

• React Query set up for use (developers can use axios (preferred) or fetch to make a HTTP requests) so that developers can make async calls to get and modify data in our backend (in firebase) to be used for the frontend display
• Created example Query Request to be used for GET requests
• Created example Mutation Request to be used for POST, PUT, and DELETE requests
• Added a date util function to standardize future API calls that need the date

How to Test

1. Start backend on local
2. Add EXPO_PUBLIC_IP_ADDR=<your ip addy> to your frontend .env
3. Add the SampleMutationRequest or SampleQueryRequest to a page and click the button to send a request

For example, since the friends page is unused currently, I added

import React from 'react';
import { SafeAreaView } from 'react-native';
import { Text, View } from 'tamagui';
import SampleQueryRequest from '../../components/SampleQueryRequest'
import SampleMutationRequest from '../../components/SampleMutationRequest'

const Friends = () => {
  return (
    <SafeAreaView>
      <View>
        <Text>Friends/search page</Text>
        <SampleQueryRequest/>
        <SampleMutationRequest/>
      </View>
    </SafeAreaView>
  );

4. NOTE: the results are cached by react-query. If you are testing on android emulator, wipe your data if needed or you can invalidate the cache. If working on browser, open developer tools/inspect and right-click refresh button at top left, then click empty cache and hard reload
5. may also need to specify port number to ensure front and backend ports are the same

Portions of this code that utilized AI generation

• I used ChatGPT to create a util function that returns the date and time in a specific format (DD-MM-YYYY) Link: https://chat.openai.com/share/c2c6fe50-55ff-4e8a-885c-4040c6c9dc99

Sample Pages

Mutation Example

Query Example

Checklist

• [x] I have added/updated relevant documentation, and I have followed the coding style guidelines.
• [ ] I have added/updated tests, and I have run the test suite and all tests pass.
• [x] I have checked for any potential conflicts with other branches and fixed any merge conflicts.