Populating a combobox with Salesforce data

Question

I want to create a component with one input box with type="date" and a combobox that gets populated with options after a date is selected in the first input box component. I want this to happen in real time(async maybe?), right after the dateChange in the input box. I have tried a method which can be seen below, but as far as I can gather it is not async, and it also throws this error "UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag --unhandled-rejections=strict (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode)." As can be seen, I do in fact throw a .catch() statement after the method but I still get this warning. Anyway the function I use is not asynchronous so any suggestion is welcomed.

leftComponent.html

<template>
    <lightning-layout class="slds-align_left slds-text-align_center container" multiple-rows="true">
        <lightning-layout-item size="12">
            <lightning-input type="date" label="Enter appointment date" variant="label-hidden"
             placeholder="Choose date of appointment" onchange={handleDateChange}></lightning-input>
        </lightning-layout-item>

        <lightning-layout-item size="12">
            <lightning-combobox name="timeBox"></lightning-combobox>
        </lightning-layout-item>
    </lightning-layout>
</template>

leftComponent.js

import getVisitsByDate from '@salesforce/apex/VisitsController.getVisitsByDate';
import { LightningElement,api, track } from 'lwc';


export default class LeftComponent extends LightningElement {

    @track dateSelected;
    @api selectedVisit;

    async handleDateChange(event){
        this.dateSelected=event.target.value;

     
        if(this.dateSelected){
           getVisitsByDate({
               record : {
                   sObjectType: 'Visit__c',
                   Date__c: this.dateSelected
               }
            }
           ).then((value) => {
               console.log(JSON.stringify(value));
               return value;
           }
           ).catch((e) => {
               console.log('Throws error'+e.body);
           });
        }
     
    }
}

VisitsController.cls(only relevant code)

public with sharing class VisitsController {
   
    @AuraEnabled
    public static List<Visit> getVisitsByDate(Visit__c record) {
        String date = record.Date__c;
         String usrId=  UserInfo.getUserID();
      List<SObject> visits = Database.query(
        'SELECT Name, Date__c, Time__c, Patient_Email__c, Patient_Name__c, Description__c FROM Visit__c WHERE CreatedById=:usrId AND Date__c=:date ORDER BY Time__c ASC'
      );
      return getVisits(visits);

     
    }
//Method that wraps sObject into a Visit object
    public static List<Visit> getVisits(List<SObject> objs) {
        List<Visit> visits = new List<Visit>();
        for (SObject obj : objs) {
          Visit visit = new Visit();
            visit.visitDate=Date.valueOf(obj.get('Date__c'));
            Visit.visitTime= obj.get('Time__c');
            visit.patientEmail= String.valueOf(obj.get('Patient_Email__c'));
            visit.patientName=String.valueOf(obj.get('Patient_Name__c'));
            visit.visitDescription=String.valueOf(obj.get('Description__c'));
            visit.visitName=String.valueOf(obj.get('Name'));
          visits.add(visit);
        }

        return visits;
    }
    



    class Visit{
        @AuraEnabled
        public Date visitDate;

        @AuraEnabled
        public Time visitTime;

        
        @AuraEnabled
        public String patientEmail;
        
        
        @AuraEnabled
        public String patientName;

        @AuraEnabled
        public String visitDescription;

        @AuraEnabled
        public String visitName;
    }
}

Answer 1

I'm fairly sure that your problem stems from the inner class.

You can simply serialize the class and return a string at parse it in Javascript ie:

return JSON.serialize(visits);

Or you could declare and interface in the VisitController class:

public interface VisitInterface {}

And make your Visit inner class implement the interface:

public class Visit implements VisitInterface

Then return a list of VisitInterface objects - this will then allow the lwc app to see the method.

Nothing else should be needed - you should be able to access the members of the Visit class with no problems in your Javascript. Of course, it's a lot easier to serialize, but perhaps not as pretty :)