MVP - CRUD - API CALLS

[keanacobarde]

User Story

I, as a user, won't see these API calls, but all the functionality of the application hinges on this. I, as the user, need to be able to create expenses, categories, or months. I should be able to edit them, delete them, and create them. I need to be able to READ all of them. This is only possible because of API calls.

Acceptance Criteria

I need to be able to achieve the following functionality: CATEGORIES

• [x] Create categories
• [x] Read category cards
• [x] Edit categories
• [x] Delete categories

EXPENSES

• [x] Create expenses
• [x] Read expenses through category details
• [x] Edit expenses
• [x] Delete expenses

MONTHS

• [x] Read months and associated expenses
• [x] Edit the months and associated expenses
• [x] Create a new month node

X Deleting months will NOT be possible.

Dependencies

Practically ALL aspects of MVP are dependent on the creation of these API calls.

Dev Notes

EXAMPLES FROM TEAM ROSTER

import { clientCredentials } from '../utils/client';

const endpoint = clientCredentials.databaseURL;

// CREATE - POST
const createNewMember = (payload) => new Promise((resolve, reject) => {
  fetch(`${endpoint}/members.json`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(payload),
  })
    .then((response) => response.json())
    .then((data) => resolve(data))
    .catch(reject);
});

// READ
const getMembers = (uid) => new Promise((resolve, reject) => {
  fetch(`${endpoint}/members.json?orderBy="uid"&equalTo="${uid}"`, {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
    },
  })
    .then((response) => response.json())
    .then((data) => {
      if (data) {
        resolve(Object.values(data));
      } else {
        resolve([]);
      }
    })
    .catch(reject);
});

// UPDATE - PATCH
const updateMember = (payload) => new Promise((resolve, reject) => {
  fetch(`${endpoint}/members/${payload.firebaseKey}.json`, {
    method: 'PATCH',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(payload),
  })
    .then((response) => response.json())
    .then((data) => resolve(data))
    .catch(reject);
});

// DELETE
const deleteMembers = (firebaseKey) => new Promise((resolve, reject) => {
  fetch(`${endpoint}/members/${firebaseKey}.json`, {
    method: 'DELETE',
    headers: {
      'Content-Type': 'application/json',
    },
  })
    .then((response) => response.json())
    .then((data) => resolve(data))
    .catch(reject);
});

// GET SINGLE MEMBER
const getSingleMember = (firebaseKey) => new Promise((resolve, reject) => {
  fetch(`${endpoint}/members/${firebaseKey}.json`, {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
    },
  })
    .then((response) => response.json())
    .then((data) => resolve(data))
    .catch(reject);
});

// SEARCH MEMBERS
const searchMembers = (searchValue, uid) => new Promise((resolve, reject) => {
  getMembers(uid).then((membersArray) => {
    const searchResults = membersArray.filter((member) => member.name.toLowerCase().includes(searchValue));
    resolve(searchResults);
  }).catch(reject);
});

export {
  getMembers,
  deleteMembers,
  createNewMember,
  updateMember,
  getSingleMember,
  searchMembers,
};

EXAMPLES FROM THE HACKATHON

/* eslint-disable no-prototype-builtins */
/* eslint-disable no-restricted-syntax */
// import { clientCredentials } from '../utils/client';

const dbUrl = 'https://localhost:7136';

const createCategory = async (categoryData) => {
  try {
    const response = await fetch(`${dbUrl}/api/category`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(categoryData),
    });

    if (!response.ok) {
      throw new Error('Error creating category');
    }

    const data = await response.json();
    return data;
  } catch (error) {
    throw new Error(`Error creating category: ${error.message}`);
  }
};

const getAllCategories = async () => {
  try {
    const response = await fetch(`${dbUrl}/api/categories`, {
      method: 'GET',
      headers: {
        'Content-Type': 'application/json',
      },
    });

    if (!response.ok) {
      throw new Error('Error fetching categories');
    }

    const data = await response.json();
    return data;
  } catch (error) {
    throw new Error(`Error fetching categories: ${error.message}`);
  }
};

const getCategoryById = async (id) => {
  try {
    const response = await fetch(`${dbUrl}/api/categories/${id}`, {
      method: 'GET',
      headers: {
        'Content-Type': 'application/json',
      },
    });

    if (!response.ok) {
      throw new Error('Error fetching category');
    }

    const data = await response.json();
    return data;
  } catch (error) {
    throw new Error(`Error fetching category: ${error.message}`);
  }
};

const updateCategory = async (id, updatedCategoryData) => {
  try {
    const response = await fetch(`${dbUrl}/api/categories/${id}`, {
      method: 'PUT',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(updatedCategoryData),
    });

    if (!response.ok) {
      throw new Error('Error updating category');
    }

    return 'Category updated successfully';
  } catch (error) {
    throw new Error(`Error updating category: ${error.message}`);
  }
};

const deleteCategory = async (id) => {
  try {
    const response = await fetch(`${dbUrl}/api/categories/${id}`, {
      method: 'DELETE',
      headers: {
        'Content-Type': 'application/json',
      },
    });

    if (!response.ok) {
      throw new Error('Error deleting category');
    }

    return 'Category deleted successfully';
  } catch (error) {
    throw new Error(`Error deleting category: ${error.message}`);
  }
};

const fetchPostWithCategories = async (postId) => {
  try {
    const response = await fetch(`${dbUrl}/postwithcategories/${postId}`); // Replace with your actual endpoint URL
    if (!response.ok) {
      throw new Error(`Failed to fetch data. Status: ${response.status}`);
    }

    const data = await response.json();

    return data;
  } catch (error) {
    console.error('Error fetching data:', error);
    throw error;
  }
};

export {
  createCategory,
  getAllCategories,
  getCategoryById,
  updateCategory,
  deleteCategory,
  fetchPostWithCategories,
};

[keanacobarde]

MAIN CONCERN: Creating conditionals so that, when there is no data to display, there's some sort of header for that.

[keanacobarde]

Tested:

• GET INCOME BY ID
• GET CATGORY BY ID Have yet to test expenses

[keanacobarde]

ALL API CALLS HAVE BEEN TESTED WITHIN POSTMAN AND PROVEN TO BE SUCCESSFUL. CLOSING TICKET.