New Custom Field class SearchLocation

Hello everyone, today I have been researching the topic of creating an additional class for a custom field. Here’s a brief summary of my goal:

Goal

Create a new custom field class, alongside existing ones like Dropdown, Multiselect, Text, Textarea, that can work with the Google Places API or another localization service.

Need

I want to store three values for a user based on the following factors: city, state, and country. Using these values, the user can be assigned to a group. The idea is to enable global, international, and regional networking among people.

Implementation

I have written a script on https://codepen.io that utilizes the Google Places API, similar to this example: https://codepen.io/philipp_96/pen/GRYBLYR. Ideally, I would like to have a search field like the one on CodePen. The fields for city, state, and country can be simple custom field (text) inputs that would be populated by the “Enter your address” field.

Problems

I’m not sure where to start:

  1. Implementing a new class that provides the search field, such as a new custom field class called “Location.”
  2. Automatically filling in the three custom text fields (City, State, Country) with the values from the search field.
  3. Where should I write this code? Should it be in a plugin or within the Discourse code itself?

I would greatly appreciate any guidance or suggestions. Thank you very much!