Class Block

client/src/templates/Introduction/components/block.tsx:91–617

}

export class Block extends Component<BlockProps, BlockState> {
  static displayName: string;
  constructor(props: BlockProps) {
    super(props);

    this.state = {
      showResetModal: false
    };
    this.handleBlockClick = this.handleBlockClick.bind(this);
    this.handleChallengeClick = this.handleChallengeClick.bind(this);
    this.handleResetClick = this.handleResetClick.bind(this);
    this.handleResetConfirm = this.handleResetConfirm.bind(this);
    this.handleResetModalClose = this.handleResetModalClose.bind(this);
  }

  handleBlockClick = (): void => {
    const { block, toggleBlock } = this.props;
    void playTone('block-toggle');
    toggleBlock(block);
  };

  handleChallengeClick = (): void => {
    const { block } = this.props;
    const dashedBlock = block
      .toLowerCase()
      .replace(/\s+/g, '-')
      .replace(/[^a-z0-9-]/g, '');
    window.history.pushState(null, '', `#${dashedBlock}`);
  };

  handleResetClick = (): void => {
    this.setState({ showResetModal: true });
  };

  handleResetConfirm = (removedChallengeIds: string[]): void => {
    const { removeModuleChallenges } = this.props;
    removeModuleChallenges({ removedChallengeIds });
  };

  handleResetModalClose = (): void => {
    this.setState({ showResetModal: false });
  };

  render(): ReactNode {
    const {
      block,
      blockLabel,
      completedChallengeIds,
      challenges,
      isExpanded: isExpandedProp,
      superBlock,
      t,
      accordion = false,
      expandAll = false
    } = this.props;

    const isExpanded = expandAll || isExpandedProp;