Understanding LWC without APEX?

Question

I made a post under the title a few days ago called "Conditional Rendering of a Form Based on Case Status LWC (if:true)"

In that post I talk about how I am trying to set an attribute to the value of an object field that is entered on a form or can be edited. I am a bit lost when it comes to how I can do this and I am mixed up by getters, getFields, getRecords, and connectedCallback. My assumption came to needing to use a connectedCallback as a onInit or when the component loads to set some logic based on the value of the field. What I am not understanding is how to use get, getRecord, or getField properly to retrieve that data (after being updated on the form or not) so I can set the value of the attribute. In Aura components I feel like you would just have a method that is a query. I know this is fundamental but I cannot find or interpret the documentation properly to get what I need. Currently this is my code:

    import { LightningElement, api, wire, track } from 'lwc';
import STATUS_FIELD from '@salesforce/schema/Case.Status';
import REASON_FIELD from '@salesforce/schema/Case.Reason';
import COMMENTS_FIELD from '@salesforce/schema/Case.Comments';

import { getFieldValue, getRecord } from 'lightning/uiRecordApi';


export default class CloseCase extends LightningElement {
    @api recordId;
    @api objectApiName;
    @track thestatus


    thefields = [STATUS_FIELD, REASON_FIELD, COMMENTS_FIELD];

    @wire(getRecord, {recordId: '$recordId', fields: thefields})
    case;

      
    handleSubmit(event){
        event.preventDefault();
        const casefields = event.detail.thefields;
        this.template.querySelector('lightning-record-form').submit(casefields);
    }

    connectedCallback() {
        if (this.case.fields.status.value === 'Closed') {
            thestatus = false
        } else {
            thestatus = true
        }  

    }

HTML

 <template>
    <template if:true={thestatus}>
    <div>
       <lightning-record-form
        record-id={recordId}
        object-api-name={objectApiName}
        fields={fields}
        columns="2"
        mode="edit"
        onsubmit={handleSubmit}>
        </lightning-record-form>
    </div>
    </template>

    <template if:false={thestatus}>
        <div>CASE IS CLOSED</div>
    </template>

</template>

Answer 1

As I explain in this answer, which is for Aura (but the similar concepts are same in LWC), you can't any access any record data in connetedCallback, which is approximately the same as aura:valueInit in Aura Components. The record has not yet had a chance to load. If you want to set data in your component based on record data, you have to wait for the record to load. In LWC, this is accomplished by using a wire handler:

case;
@wire(getRecord, {recordId: '$recordId', fields: thefields})
  caseWireHandler(result) {
    let { data, error } = result;
    if(data) {
      this.case = result;
      this.thestatus = getFieldValue(data, STATUS_FIELD) === 'Closed'
    }
    if(error) {
      // handle error here
    }
  }

Note that track is no longer necessary on primitives in LWC (e.g. you can just write thestatus instead of @track thestatus), and don't forget to use this. to access class properties.