Cannot read properties of null (reading 'syscall')

Help me!
1

Feature(s) impacted

Smart views

Observed behavior

Smart view table is throwing

Expected behavior

Trying to walk over a table results in this error and only a single record loads.

Failure Logs

In this optional section, please:

  • include any relevant log snippets if necessary,
  • or remove this section if left empty.
vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'syscall')
    at Object.evaluate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:342144)
    at zt.evaluateSyscall (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378874)
    at zt.evaluateInner (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378566)
    at zt.evaluateOuter (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378487)
    at Ut.next (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388367)
    at Ut._execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388245)
    at Ut.execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388191)
    at Wt.insertItem (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:381911)
    at Wt.sync (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:381458)
    at Wt.evaluate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:380901)
    at It._execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:379182)
    at It.execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:379052)
    at qt.rerender (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:382868)
    at Mn.render (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:74001)
    at vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77453
    at Nt (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:377356)
    at Tn._renderRoots (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77371)
    at Tn._renderRootsTransaction (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77731)
    at Tn._revalidate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:78211)
    at invoke (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:418825)
    at h.flush (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:417895)
    at p.flush (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:419675)
    at B._end (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:424760)
    at B._boundAutorunEnd (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:421182)

Context

Please provide in this mandatory section, the relevant information about your configuration:

  • Project name: Rupie
  • Team name: …
  • Environment name: Production
  • Agent type & version: …
  • Recent changes made on your end if any: …
2

Hi @austinrupie,

I’m sorry, I’m not sure to understand your issue. Could you please share the code of your Smart View :pray: ?

3

Sure

component:

import Component from '@glimmer/component';
import { loadExternalStyle, loadExternalJavascript } from 'client/utils/smart-view-utils';
import { tracked } from '@glimmer/tracking';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';

export default class extends Component {
  
  @service lianaServerFetch;
    
  userMode = true;
  
  @tracked experienceList = [
  {
    name: 'Any Experience',
    value: undefined
  },
  {
    name: 'less than a year or more',
    value: 0
  },
  {
    name: '1+ years',
    value: '1'
  },
  {
    name: '3+ years',
    value: '3'
  },
  {
    name: '5+ years',
    value: '5'
  },
  {
    name: '10+ years',
    value: '10'
  },
  {
    name: '15+ years',
    value: '15'
  }
];

  @tracked users;
  
  @tracked loading = false;
  
  @tracked search = '';
  
  @tracked skills = [];
  
  @tracked locations = [];
  
  @tracked employers = [];
  
  @tracked skillList = [];
  
  @tracked experience;

  constructor(...args) {
    super(...args);
    this.fetchData = this.fetchData.bind(this);
    this.skills = [];

    this.fetchSkills();
    this.fetchData()
  }
  
  async fetchSkills() {
    const skills = await this.lianaServerFetch.fetch('/forest/skill-list-ids', {});
    const response = await skills.json();
    this.skillList = response.data;
  }
  
  async fetchData(userMode) {
    const search = this.searchCritera;
    this.loading = true;
    const response = await this.lianaServerFetch.fetch('/forest/recent-suggested-talent', {
      body: JSON.stringify(search),
      method: 'POST'
    });
    this.loading = false;
    this.users = await response.json();
  }
  
  @action
  refetchData(value) {
    this.fetchData();
  }
}

template:

<div class="c-smart-chart">
  <div class="wrapper-sm">
    <div class="side-nav">
      <Button::BetaButton
        @isLoading={{this.loading}}
        @type="primary"
        @text="Refresh"
        @async={{false}}
        @action={{action 'refetchData'}}
      />
    </div>
   <div className='table'>
     <BetaTable
      @columns={{array 'id' 'First Name' 'Last Name' 'Last Introduced' '# Introductions' 'Email' 'linkedinUrl' 'Role' 'Experience' 'Location'}}
      @rows={{this.users}}
      as |RowColumn user|
    >
    <RowColumn>
      <a target="_blank"  href={{(concat "https://app.forestadmin.com/Rupie/Production/Rupie%20Core/data/2555222/index/record/2555222/" user.id  "/details")}}>{{user.id}}</a>
    </RowColumn>
    <RowColumn>
      <span>{{user.firstName}}</span>
    </RowColumn>
     <RowColumn>  
      <span>{{user.lastName}}</span>
    </RowColumn>
    <RowColumn>
      <div>
        <BetaBadge
          @value={{moment-from-now user.SuggestedTalent.firstObject.createdAt}}
          @color="#4DD099"
        />
      </div>
      <div>
        <a target="_blank"  href={{(concat "https://app.forestadmin.com/Rupie/Production/Rupie%20Core/data/Beacon/index/record/Beacon/" user.SuggestedTalent.firstObject.Beacon.id "/details")}}>{{user.SuggestedTalent.firstObject.Beacon.title}}</a>
      </div>
      <div>
       {{user.SuggestedTalent.firstObject.submitter}}
      </div>
    </RowColumn>
     <RowColumn>
      <span>{{user.SuggestedTalent.length}}</span>
    </RowColumn>
     <RowColumn>
      <span>{{user.email}}</span>
    </RowColumn>
     <RowColumn>
      <a target="_blank" href={{user.UserProfile.linkedinUrl}}>{{user.UserProfile.linkedinUrl}}</a>
    </RowColumn>
     <RowColumn>
      <span>{{user.meta.Employment.Role}}</span>
    </RowColumn>
     <RowColumn>
      <span>{{user.meta.Employment.Experience}}</span>
    </RowColumn>
     <RowColumn>
      <span>{{user.UserProfile.location}}</span>
    </RowColumn>
  </BetaTable>
   </div>
  </div>
</div>

Basically the first row of the table is populated, but Ember throws and only one row ever exists.

4

The editor seems to fail and suddenly I can’t edit the code, also seeing this error:

Uncaught (in promise) TypeError: Cannot destructure property 'manager' of 'e' as it is null.
    at u.resolvedComponent (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:320841)
    at vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:310683
    at re (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:310708)
    at l (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:309948)
    at vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:307082
    at _.compile (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:299527)
    at te (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:309991)
    at vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:309657
    at Z.compile (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:309689)
    at Ut.compile (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:385798)
    at Object.evaluate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:352205)
    at Object.evaluate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:342154)
    at zt.evaluateSyscall (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378874)
    at zt.evaluateInner (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378566)
    at zt.evaluateOuter (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:378487)
    at Ut.next (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388367)
    at Ut._execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388245)
    at Ut.execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:388191)
    at Bt.handleException (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:380034)
    at Yt.handleException (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:382545)
    at It.throw (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:379338)
    at We.evaluate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:353426)
    at It._execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:379182)
    at It.execute (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:379052)
    at qt.rerender (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:382868)
    at Mn.render (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:74001)
    at vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77453
    at Nt (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:377356)
    at Tn._renderRoots (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77371)
    at Tn._renderRootsTransaction (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:77731)
    at Tn._revalidate (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:78211)
    at invoke (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:418825)
    at h.flush (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:417895)
    at p.flush (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:419675)
    at B._end (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:424760)
    at B._boundAutorunEnd (vendor-25c062144d2db8f56ffda7fca6e0e8b7.js:58:421182)
5 
  "forest-express-sequelize": "^7.12.2",