[MVP Socrata API] Implement inital Socrata API GET request

[ryanfchase]

Overview

We need to implement a service that can call the Socrata API and return its response from any component

Developer Info

We are NOT merging this into develop. This is meant to be a staging branch for the Blank Map feature ONLY

• I understand

Action Items

Initial Socrata API Setup:

• create feature branch to be merged into Blank Map staging branch, e.g. feature-socrata-api-layer
• Create a API function in Utils folder
• Deploy 311-Data forked repo on Github Pages to test that a fetch call will execute when app is hosted
• GET ALL Filter criteria for Socrata API GET call
  • neighborhood council
  • start date, end date
  • service request types
  • service request status (e.g. open/closed/all)
• Make a submit button on the Search & Filters modal (temporary)
• Submit button to Execute API GET call with the search criteria
• Display response from GET call
• review changes with team

Defining GET data model with Validation:

Request Type Model can be found here: #1891 (comment)

• Create a file for RequestTypeModel obj (or define the model name with what you think is appropriate for the data).
• Utilize validation package to cast appropriate fields for the RequestTypeModel. Yup package. Open to other validation package suggestions!
• Update the GET call data to structure the data to the RequestTypeModel obj.
• Release the dependency on DEV - Update Search/Filter Modal functionality and design #1868 and if there are no other dependencies, move that issue into the new issue approval and add the label ready for dev lead

Resources/Instructions

Data Types

• Brainstorming 311 Data - Data Types (Google Doc)

Creative liberty to get whatever data you want for (Initial Socrata API Setup section).

• Instructions on how to deploy 311-data to your fork and publish the page: Migrate devs to Vite - checklist #1834

GET 2024 Boundary data as JSON

fetch("https://data.lacity.org/resource/ddkj-4vd4.json", {
    method: 'GET',
    headers: {
        'Accept': 'application/json',
    },
})
   .then(response => response.json())
   .then(response => console.log(JSON.stringify(response)))

GET 2024 Boundary data as GeoJSON

fetch("https://data.lacity.org/resource/ddkj-4vd4.geojson", {
    method: 'GET',
    headers: {
        'Accept': 'application/geo+json',
    },
})
   .then(response => response.json())
   .then(response => console.log(JSON.stringify(response)))

[kdow]

Some clarifying questions:

• It looks like we used to do something similar but I don't think anything here is currently being used anywhere. We might want to replace/remove this at some point.
• We'll need to call a different endpoint for different years, should I include the logic for calling different years in this ticket?
• It looks like we do some cleaning and filtering through python scripts should any of this be handled?
• For this step: "visualize result on a test page (e.g. define new Route, only to be used on this branch)" - are you wanting to see the results shown on a map, or just displayed as text?

[ryanfchase]

It looks like we used to do something similar but I don't think anything here is currently being used anywhere. We might want to replace/remove this at some point.

We'll leave this as is, although we acknowledge its not being used.

We'll need to call a different endpoint for different years, should I include the logic for calling different years in this ticket?

Please deliver an example of accessing the 2024 resource first, then we'll build infrastructure for accessing multiple years.

[traycn]

Following up after our team meeting. Added an additional step to see that fetch works on a deployed Github Pages site. If it does not then we'll be blocked and have a team discussion on another solution to run a Socrata API GET request.

Potential solution: JSON API

• uploading 311-Data on a JSON file in the 311-Data repository
• executing JSON API GET request for data from the file

[kdow]

The code is on feature-socrata-api-layer feature branch. I verified fetch works on my deployed Github Pages site. Results are viewable through the console after pressing 'Get data' button on the Search and Filters modal.

[traycn]

Added a section to structure the data from Socrata API to our RequestTypeModel (#1891 (comment)) @kdow . I've included a validation package; install with npm. Open to other package suggestion!

Defining GET data model with Validation:

Request Type Model can be found here: #1891 (comment)

• Create a file for RequestTypeModel obj (or define the model name with what you think is appropriate for the data).
• Utilize validation package to cast appropriate fields for the RequestTypeModel. Yup package. Open to other validation package suggestions!
• Update the GET call data to structure the data to the RequestTypeModel obj.

[traycn]

Hi @kdow ,

Please leave a comment with the following items:

• updated ETA
• progress from last week
• Any blockers this week?
• availability for communications during the week

[kdow]

updated ETA: 2/7
progress from last week: I've just started working on the additional action items that were added on Wednesday
Any blockers this week?: no
availability for communications during the week: M-F 1pm - 4pm

[kdow]

Code for updates can be viewed on commit in feature-socrata-api-layer branch. I have this working locally but got an error on my deployed github page; I'll try to get that working.

Console.log of initial API response:

Console.log after validation:

I kept the validation schema in the same file for now for ease of reference.

There may be additional validation checks we can add if wanted. Possibly for categorical strings (E.g. RequestType (12 values), AssignTo (59 values)) - we could use string().matches().

[ryanfchase]

@kdow sounds good, thanks for the update. Can you additionally do the following? Please provide...

• an updated ETA
• your availability for the week
• can you encapsulate the images you provided in Details dropdowns? Here are instructions on how to do so: Get Your Team Questions Answered Here #1878 (comment)

Thanks!

[ryanfchase]

Error in fork:

Notes

• Yup: try adding nullable to all location?
• Check the object import. Possibly console log it.
  • but the problem is on the fork... so we'd have to make it log on the fork :/

There may be additional validation checks we can add if wanted. Possibly for categorical strings (E.g. RequestType (12 values), AssignTo (59 values)) - we could use string().matches().

• (needed for follow up ticket) would be helpful for a list of all possible options for all options for categorical VARCHAR
  • what are the main ones
    • SR Type
    • SR Status
    • NC Name (and Id)
  • the other ones? RC TODO

Action Items for Leads

• create branch for this ticket to merge into so we can have a PR that doesn't merge into main
• create a branch, similar reasoning as above, for: [MVP Huggingface] Define Request Type model and GET data from HuggingFace repos. #1891

[kdow]

Updated ETA: 2/12
Availability: M-F 1pm-4pm

[traycn]

Met with kdow, we have resolved a small fix for the solution.

@kdow feel free to leave a comment of your github page showing your deployed branch and other details you'd like to share.

[kdow]

My github page is now working. Updates (API results before validation and after validation) can now be viewed in console after clicking Get data button.