How to use the @blueprintjs/icons.IconNames.TICK function in @blueprintjs/icons

private sideContentProps: (p: GradingWorkspaceProps, q: number) => SideContentProps = (
    props: GradingWorkspaceProps,
    questionId: number
  ) => ({
    handleActiveTabChange: props.handleActiveTabChange,
    tabs: [
      {
        label: `Grading: Question ${questionId + 1}`,
        iconName: IconNames.TICK,
        /* Render an editor with the xp given to the current question. */
        body: (
          
        ),

body: (
          
        ),
        id: SideContentType.autograder
      }
    ];
    const isGraded = props.assessment!.questions[questionId].grader !== undefined;
    if (isGraded) {
      tabs.push(
        {
          label: `Report Card`,
          iconName: IconNames.TICK,
          body: (
            
          ),
          id: SideContentType.grading
        },
        {
          label: `Chat`,
          iconName: IconNames.CHAT,

icon: IconNames.CHEVRON_UP,
    id: 'prepend'
  },
  {
    label: 'Postpend',
    icon: IconNames.CHEVRON_DOWN,
    id: 'postpend'
  },
  {
    label: 'Solution Template',
    icon: IconNames.MANUAL,
    id: 'solutionTemplate'
  },
  {
    label: 'Suggested Answer',
    icon: IconNames.TICK,
    id: 'answer'
  }
];

/*
 * activeEditor is the default editor to show initially
 */
export class ProgrammingQuestionTemplateTab extends React.Component<
  IQuestionEditorProps,
  IQuestionEditorState
> {
  public constructor(props: IQuestionEditorProps) {
    super(props);
    this.state = {
      activeEditor: questionEditors[0],
      templateValue: '',

<div>Announcements</div>
      

      
        
        <div>Assessments</div>
      

      
        
        <div>Materials</div>
      
    
  
)

private createAbbreviation(abbreviation: string, selectedAbbreviations: string[]) {
        const selectedIcon = selectedAbbreviations.find((currentAbbreviation) =>
            abbreviation === currentAbbreviation) !== undefined ?
             : null;

        const conflictIcon = this.abbreviationHasConflicts(abbreviation) ?
             : null;

        const numberOfSections = this.props.searchItem.sectionsMatchingCourse.filter(
            (section) => section.departmentAndCourse === abbreviation).length;

        const numberOfSectionsTag = (
            <span>
                
                     {numberOfSections} Sections 
                
                
                     {numberOfSections} 
                
            </span>

public render() {
    const gradingStatus = this.props.data.gradingStatus;
    let iconName: IconName;
    let tooltip: string;
    let intent: Intent;

    switch (gradingStatus) {
      case GradingStatuses.graded:
        iconName = IconNames.TICK;
        tooltip = `Fully graded: ${this.props.data.gradedCount} of 
          ${this.props.data.questionCount}`;
        intent = Intent.SUCCESS;
        break;
      case GradingStatuses.grading:
        iconName = IconNames.TIME;
        tooltip = `Partially graded: ${this.props.data.gradedCount} of 
          ${this.props.data.questionCount}`;
        intent = Intent.WARNING;
        break;
      case GradingStatuses.none:
        iconName = IconNames.CROSS;
        tooltip = `Not graded: ${this.props.data.gradedCount} of 
          ${this.props.data.questionCount}`;
        intent = Intent.DANGER;
        break;

);
    }
}

<label>Title: </label>
            <input value="{this.state.saveTitle}">
          
          <li>
            <label>Description: </label>
            <input value="{this.state.saveDescription}" id="description">
          </li>
          <li>{controlButton('Submit', IconNames.TICK, this.handleRecorderSaving)}</li>
        
      
    );
    return (
      <div>
        <br>
        <div>
          
            <h1>{this.renderLabel(this.state.duration)}</h1>
          
        </div>
        <br>
        <div>
          {this.props.recordingStatus === RecordingStatus.notStarted &amp;&amp; RecorderStartButton}
          {this.props.recordingStatus === RecordingStatus.paused &amp;&amp; RecorderResumeButton}
          {this.props.recordingStatus === RecordingStatus.recording &amp;&amp; RecorderPauseButton}</div></div>

className="Input"
                    intent="none"
                    maxLines={1}
                    minLines={1}
                    multiline={true}
                    placeholder="Enter folder name..."
                    selectAllOnFocus={true}
                    value={this.state.newFolderName}
                    onChange={this.handleSetFolderName}
                  />
                
                <div>
                  <div>
                    {controlButton(
                      'Confirm',
                      IconNames.TICK,
                      this.handleCreateMaterialFolder,
                      {},
                      !this.state.newFolderName
                    )}
                    {controlButton('Cancel', IconNames.CROSS, this.handleCloseDialog)}
                  </div>
                </div>
              
            )}
          
        
        
        <div>
          <div>
            </div></div>

body: (
            
          ),
          id: SideContentType.editorLocalGraderDeployment
        },
        {
          label: `Grading`,
          iconName: IconNames.TICK,
          body: (
            
          ),
          id: SideContentType.editorGrading
        }
      ];
      if (qnType === 'programming') {
        tabs.push({
          label: `Autograder`,
          iconName: IconNames.AIRPLANE,
          body: (