LocationPro: Discover Your Future Paradise

@app.route('/filtered_city_data', methods=['GET'])
def get_filtered_city_data():
    if session:
        try:
            # Get the query parameters
            city_median_income_min = request.args.get('city_median_income_min', type=float)
            city_median_income_max = request.args.get('city_median_income_max', type=float)
            city_median_income_null_is_ok = request.args.get('city_median_income_null_is_ok', type=str, default='false')
            
            query = session.query(CombinedCityData)
                        if city_median_income_min:
                            if city_median_income_null_is_ok.lower() == 'true':
                                query = query.filter(
                                    (CombinedCityData.city_median_income.between(city_median_income_min, city_median_income_max)) | (CombinedCityData.city_median_income.is_(None))
                                )
                            else:
                                query = query.filter(
                                    CombinedCityData.city_median_income.between(city_median_income_min, city_median_income_max),
                                    CombinedCityData.city_median_income.isnot(None)
                                )
                        if city_population_min:
                            if city_population_null_is_ok.lower() == 'true':
                                query = query.filter(
                                    (CombinedCityData.city_population.between(city_population_min, city_population_max)) | (CombinedCityData.city_population.is_(None))
                                )
                            else:
                                query = query.filter(
                                    CombinedCityData.city_population.between(city_population_min, city_population_max),
                                    CombinedCityData.city_population.isnot(None)
                                )

# THIS END POINT ADDS A CITY TO A USER'S FAVORITES
@app.route('/users/<int:user_id>/favorites/<int:city_id>', methods=['POST'])
@jwt_required()
def add_city_to_favorites(user_id, city_id):
    current_user = get_jwt_identity()

    # Check if the authenticated user exists
    if current_user is None:
        response = make_response(jsonify({'message': 'User not found'}), 404)
        response.headers['Content-Type'] = 'application/json'
        return response

    # Check if the authenticated user is adding a favorite to their own account of someone else's
    if current_user.get('id') != user_id:
        response = make_response(jsonify({'message': 'You are not authorized to add a favorite to this user'}), 403)
        response.headers['Content-Type'] = 'application/json'
        return response

    try:
        # Check if the user and city exist
        user = session.query(User).filter_by(id=user_id).first()
        city = session.query(CombinedCityData).filter_by(id=city_id).first()
        if not user:
            response = make_response(jsonify({'message': 'User not found'}), 404)
            response.headers['Content-Type'] = 'application/json'
            return response
        if not city:
            response = make_response(jsonify({'message': 'City not found'}), 404)
            response.headers['Content-Type'] = 'application/json'
            return response

        # Check if the city is already in the user's favorites
        favorite = session.query(Favorites).filter_by(user_id=user_id, city_id=city_id).first()
        if favorite:
            response = make_response(jsonify({'message': 'City already in favorites'}), 400)
            response.headers['Content-Type'] = 'application/json'
            return response

        # Add the city to the user's favorites
        favorite = Favorites(user_id=user_id, city_id=city_id)
        session.add(favorite)
        session.commit()

        # Return a response indicating success
        response = make_response(jsonify({'message': 'City added to favorites'}), 201)
        response.headers['Content-Type'] = 'application/json'
        return response

    except Exception as e:
        session.rollback()
        response = make_response(jsonify({'message': str(e)}), 500)
        response.headers['Content-Type'] = 'application/json'
        return response

export default function MinMax({ name, questionMarkText, columnName, onMinChange, onMaxChange, onNAChange, isItActive,
                                                                      minChange, maxChange, NAChange, activeChange }) {
  const [minValue, setMinValue] = useState(minChange); // Initialize to null instead of 0
  const [maxValue, setMaxValue] = useState(maxChange); // Initialize to null instead of 100
  const [value, setValue] = useState([0, 100]); // Initialize with default values
  const [isActive, setIsActive] = useState(activeChange);
  const [isNAChecked, setIsNAChecked] = useState(NAChange);
  const [isNADisabled, setIsNADisabled] = useState(false);
  const [apiCallMade, setApiCallMade] = useState(false); // Checking whether we already made an API call using toggle
  const URL = process.env.REACT_APP_BD_URL; // Defining the database URL



  useEffect(() => {
    if (minValue !== null && maxValue !== null) { // Render only when the API call has completed
      setValue([minValue, maxValue]);
    }
  }, [minValue, maxValue]);

  const handleInputChange = (event, index) => {
    const newValue = event.target.value === '' ? '' : Number(event.target.value);
    const updatedValue = [...value];
    updatedValue[index] = newValue;
    setValue(updatedValue);

    if (index === 0) {
      setMinValue(newValue);
      onMinChange(newValue);
    } else if (index === 1) {
      setMaxValue(newValue);
      onMaxChange(newValue);
    }
  };

  const handleActiveToggle = () => {
    setIsActive(!isActive);
    if (!isActive) {
      if (!apiCallMade) {
        axios
          .get(`${URL}/column_review?column_name=${columnName}`)
          .then(response => {
            setMinValue(response.data.min_value); // Setting the most min value
            onMinChange(response.data.min_value); // Passing that value to SearchBox
            setMaxValue(response.data.max_value); // Setting the most max value
            onMaxChange(response.data.max_value); // Passing it to the SearchBox
            setIsNAChecked(response.data.null_values_exist); // Do we need to check NA?
            onNAChange(response.data.null_values_exist); // Sending it to the SearchBox
            setIsNADisabled(!response.data.null_values_exist); // Making the checkbox disabled if needed
            setApiCallMade(true); // Marking as API call made
            // console.log(response.data)
          })
          .catch(error => {
            console.error(error);
          });
      } else {
        onMinChange(minValue);
        onMaxChange(maxValue);
        onNAChange(isNAChecked);
      }
      isItActive(!isActive);
    } else {
      onMinChange(null);
      onMaxChange(null);
      onNAChange(null);
      isItActive(false);
    }
  };


  const handleNACheck = () => {
    if (isActive && !isNADisabled) {
      setIsNAChecked(!isNAChecked);
      onNAChange(!isNAChecked);
    }
  };



  return (
    <Box sx={{ width: 300 }}>
      <Grid container alignItems="center" justifyContent="space-between">
        <Grid item>
          <Typography id="input-slider" gutterBottom>
            {name}
            <Tooltip title={questionMarkText}>
              <QuestionMark />
            </Tooltip>
          </Typography>
        </Grid>
        <Grid item>
          <Switch checked={isActive} onChange={handleActiveToggle} />
        </Grid>
      </Grid>
      {isActive && (
        <Grid container spacing={2} alignItems="center">
          <Grid item>
            <Checkbox
              checked={isNAChecked}
              disabled={!isActive || isNADisabled}
              onChange={handleNACheck}
              inputProps={{ 'aria-label': 'NA checkbox' }}
            />
            NA
          </Grid>
          <Grid item>
            <StyledInput
              value={value[0]}
              size="small"
              onChange={(event) => handleInputChange(event, 0)}
              inputProps={{
                step: 10,
                min: minValue,
                type: 'number',
                'aria-labelledby': 'input-slider',
              }}
              sx={{ width: 80 }}
            />
          </Grid>
          <Grid item>
            <Typography variant="body2">to</Typography>
          </Grid>
          <Grid item>
            <StyledInput
              value={value[1]}
              size="small"
              onChange={(event) => handleInputChange(event, 1)}
              inputProps={{
                step: 10,
                max: maxValue,
                type: 'number',
                'aria-labelledby': 'input-slider',
              }}
              sx={{ width: 80 }}
            />
          </Grid>
        </Grid>
      )}
    </Box>
  );
};  

<MinMax name="City Population" questionMarkText="Enter minimum and maximum size for the city population" columnName="city_population" onMinChange={(value) => dispatch(setCityPopulationMin(value))} onMaxChange={(value) => dispatch(setCityPopulationMax(value))} onNAChange={(value) => dispatch(setCityPopulationIsNA(value))} isItActive={(value) => dispatch(setCityPopulationIsActive(value))} minChange={cityPopulationMin} maxChange={cityPopulationMax} NAChange={cityPopulationIsNA} activeChange={cityPopulationIsActive} />