const _renderTableTopFields = () => {
    return (
      <TableTopFields.Provider value={tableTopFieldsContext}>
        <DocumentProperty
          isNotTable={isNotTable}
          onUserInfoDisplay={onUserInfoDisplay}
          pending={props.pending}
          isUserInfoTooltip={isUserInfoToolTip}
          doctype={doctype}
          onPowerListHandler={onHandlerempowerment}
          empowermentDataPending={empowermentInput.loading}
        />
      </TableTopFields.Provider>
    );
  };

  //  NOTE table top fields

  const _renderPaidVersionFields = () => {
    return (
      <Requisite.Provider value={requisiteFieldsContext}>
        <RequisiteFields />
      </Requisite.Provider>
    );
  };

  // NOTE excel shablon skachat button excel upload excel and checkboxes

  const _renderTovarGroupBtn = () => {
    return (
      <TovarGroupBtn
        empowermentTax={empowermentTax}
        onChange={onTableOutInputsHandler}
        onOpen={onExcelImportModal}
        landscapeOrientation={initialValuesState?.landscapeOrientation}
        autoCalculate={initialValuesState?.autoCalculate}
        discount={initialValuesState?.discount}
        toFromAct={initialValuesState?.toFormAct}
        doctype={doctype}
      />
    );
  };

  // NOTE table

  const _renderTable = () => {
    return (
      <TableData.Provider value={tableContext}>
        <Table
          isAutoCalculate={!initialValuesState.autoCalculate}
          errors={tableErrorFields}
          discount={initialValuesState.discount ? discountAmount : null}
          isTemplate={false}
          header={header}
          item={setInitialItem(doctype)}
          doctype={doctype}
          onRemove={onRemoveHandler}
        />
      </TableData.Provider>
    );
  };

  // NOTE table bottom fields

  const _renderTableBottomFields = () => {
    return (
      <TableBottomFields
        ref={span}
        change={change}
        path={filePath}
        values={bottomFields}
        isNotTable={isNotTable}
        onChange={onHandeTableBottomFields}
        doctype={doctype}
      />
    );
  };

  // NOTE reset and submit button

  const _renderSubmitResetButton = () => {
    return (
      <StyledButtonWrapper className={isNotTable && !empowermentTax ? 'not-table-buttons' : 'table-buttons'}>
        <Btn type="button" onClick={onResetHandler}>
          {t('cancel')}
        </Btn>
        <Btn onClick={handleSubmit} loading={viewPending}>
          {t('send')}
        </Btn>
      </StyledButtonWrapper>
    );
  };

  const isChangeStructureForm = isNotTable && !empowermentTax;

  // NOTE WHOLE return



  return (
    <>
      {pdfFile && (
        <Suspense fallback={<></>}>
          <Pdf
            url={pdfFile}
            visible={true}
            change={onDocumentVisibleModalHandler}
            pending={get(props.signs, 'signPending')}
            invoice={t('checkTheDocument')}
            isEmpowermentList={empowermentInput.success}
            onSetAgentField={onSetAgentField}
          />
        </Suspense>
      )}

      {empowermentInput.errorPower || empowermentInput.success ? (
        <Suspense fallback={<></>}>
          <Modal
            color={empowermentInput.errorPower && colors.warning}
            width={empowermentInput.errorPower ? 0.4 * window.innerWidth : 0.8 * window.innerWidth}
            title={t('warning')}
            height={empowermentInput.errorPower ? '20vh' : '50vh'}
            visible={true}
            onClose={onHideEmpowermentDoc}>
            {empowermentInput.errorPower ? (
              'warning'
            ) : (
              <List list={empowermentInput.list} onSetAgentField={onSetAgentField} success={empowermentInput.success} />
            )}
          </Modal>
        </Suspense>
      ) : (
        ''
      )}

      {dateDifferenceError && (
        <Suspense fallback={<></>}>
          <Modal color={colors.warning} title={t('DateAlert')} visible={true} onClose={onDateAlertModalHandler}>
            {_renderAlertDate()}
          </Modal>
        </Suspense>
      )}

      {isImportExcelModalVisible && (
        <Suspense fallback={<></>}>
          <Modal title={t('ExcelfileUpload')} visible={true} onClose={onExcelImportModal} width={0.6 * window.innerWidth}>
            {_renderExcelUploadComponent()}
          </Modal>
        </Suspense>
      )}

      {visible && (
        <PdfData.Provider value={pdfContext}>
          <TemplateModal visible={true} onClose={onCloseHandler} />
        </PdfData.Provider>
      )}

      <h2>{label}</h2>
      <StyledForm table={isNotTable.toString()} id="making-form">
        {isChangeStructureForm || (
          <StyledSection>
            {' '}
            <DocumentPropertyFormWrapper>{_renderTableTopFields()}</DocumentPropertyFormWrapper> {_renderPaidVersionFields()}
          </StyledSection>
        )}
        {isChangeStructureForm && <DocumentPropertyFormWrapper>{_renderTableTopFields()}</DocumentPropertyFormWrapper>}

        {isChangeStructureForm || (
          <Suspense fallback={<></>}>
            {_renderTovarGroupBtn()}
            {_renderTable()}
          </Suspense>
        )}

        <StyledTableBottomDiv
          className={`submit-reset-btn-container ${isNotTable && !empowermentTax ? 'not-table' : 'table'}`}
          principial={principial || actTax || empowermentTax}>
          {_renderTableBottomFields()}
        </StyledTableBottomDiv>

        {_renderSubmitResetButton()}
      </StyledForm>
      {isUserInfoToolTip && (
        <StyledUserInfoContainerBlack onClick={onHideUserToolTip} isHide={!isUserInfoToolTip}></StyledUserInfoContainerBlack>
      )}
    </>
  );
};