How to use @microsoft/sp-page-context - 6 common examples

// Check if a result was retrieved
      if (result) {
        // Check if an error was retrieved
        if (result.error) {
          // Do not allow rendering when there was an error
          this.setState({
            allowRender: false
          });
          console.error(`Error retrieved while checking user's remote list or library permissions.`);
          return;
        }

        // Check the result high and low value are returned
        if (typeof result.High !== "undefined" && typeof result.Low !== "undefined") {
          // Create the permission mask
          const permission = new SPPermission(result);
          const hasPermissions = permission.hasAllPermissions(...permissions);

          this.setState({
            allowRender: hasPermissions
          });
          return;
        }
      } else {
        this.setState({
          allowRender: false
        });
        console.error(`No result value was retrieved when checking the user's remote list or library permissions.`);
        return;
      }
    }
  }

public onInit(): Promise {
    Log.info(LOG_SOURCE, 'Initialized LockItemCommandSet');
    // this where we check the permissions
    this._hasCorrectPermissions = this.context.pageContext.list.permissions.hasPermission(SPPermission.managePermissions);

    // setting up the pnp to work correctly with SPFx
    pnp.setup({
      spfxContext: this.context
    });
    return Promise.resolve();
  }

public onRenderCell(event: IFieldCustomizerCellEventParameters): void {
    // Use this method to perform your custom cell rendering.  The CellFormatter is a utility
    // that you can use to convert the cellValue to a text string.
    const value: string = event.cellValue;
    const id: string = event.row.getValueByName('ID').toString();
    const hasPermissions: boolean = this.context.pageContext.list.permissions.hasPermission(SPPermission.editListItems);

    const toggle: React.ReactElement<{}> =
      React.createElement(Toggle, { checked: value, id: id, disabled: !hasPermissions, onChanged: this.onToggleValueChanged.bind(this) } as IToggleProps);

    ReactDOM.render(toggle, event.cellDiv);

  }

public onRenderCell(event: IFieldCustomizerCellEventParameters): void {
    // Use this method to perform your custom cell rendering.  The CellFormatter is a utility
    // that you can use to convert the cellValue to a text string.
    const value: string = event.cellValue;
    const id: string = event.listItem.getValueByName('ID').toString();
    const hasPermissions: boolean = this.context.pageContext.list.permissions.hasPermission(SPPermission.editListItems);


    const slider: React.ReactElement<{}> =
      React.createElement(Slider, { value: value, id: id, disabled: !hasPermissions, onChange: this.onSliderValueChanged.bind(this) } as ISliderProps);

    ReactDOM.render(slider, event.cellDiv);
  }

public onListViewUpdated(event: IListViewCommandSetListViewUpdatedParameters): void {
    //Get a reference to our command
    const command: Command | undefined = this.tryGetCommand("spfxClone");

    if (command) {
      let allowed = true;

      //If Lists is specified, the command should only show up for named lists
      if(typeof this.properties.Lists !== "undefined" && this.properties.Lists.length > 0) {
        let lists = this.properties.Lists.split(',');
        allowed = lists.indexOf(this.context.pageContext.list.title) > -1;
      }
      //Only show the command if at least 1 row is selected and the user has permission to add list items
      command.visible = event.selectedRows.length >= 1 && this.context.pageContext.list.permissions.hasPermission(SPPermission.addListItems) && allowed;
    }
  }

serviceScope.whenFinished(() => {
                this._spHttpClient = serviceScope.consume(SPHttpClient.serviceKey);
                this._pageContext = serviceScope.consume(PageContext.serviceKey);
                this._currentWebUrl = this._pageContext.web.absoluteUrl;
            });
        });