@react-native-ohos/pull-to-refresh/src/Header/native.ts

A react-native PullToRefresh component.

import React, {Component, ReactNode} from 'react';
import {findNodeHandle, requireNativeComponent, UIManager, ViewProps} from 'react-native';
// import {PullToRefreshOffsetChangedEvent, PullToRefreshStateChangedEvent} from '../types';
import { NativePullToRefreshHeaderProps } from './DefaultPullToRefreshHeaderNativeComponent';
import RNCPullToRefreshHeader from './DefaultPullToRefreshHeaderNativeComponent';

// interface NativePullToRefreshHeaderProps extends ViewProps {
//   onRefresh?: () => void;
//   onStateChanged?: (event: PullToRefreshStateChangedEvent) => void;
//   onOffsetChanged?: (event: PullToRefreshOffsetChangedEvent) => void;
//   refreshing: boolean;
// }

const NativePullToRefreshHeader = RNCPullToRefreshHeader;
  // requireNativeComponent<NativePullToRefreshHeaderProps>('RefreshHeader'); // todo mark

type NativePullToRefreshHeaderInstance = InstanceType<typeof NativePullToRefreshHeader>;

const PullToRefreshHeaderCommands = {
  setNativeRefreshing(componentOrHandle: NativePullToRefreshHeaderInstance, refreshing: boolean) {
    UIManager.dispatchViewManagerCommand(findNodeHandle(componentOrHandle), 'setNativeRefreshing', [
      refreshing,
    ]);
  },
};
class PullToRefreshHeader extends Component<NativePullToRefreshHeaderProps> {
  _nativeRef: NativePullToRefreshHeaderInstance | null = null;
  _lastNativeRefreshing = false;

  _onRefresh = () => {
    this._lastNativeRefreshing = true;
    this.props?.onRefresh?.();
    this.forceUpdate();
  };

  _setNativeRef = (ref: NativePullToRefreshHeaderInstance) => {
    this._nativeRef = ref;
  };

  componentDidMount() {
    this._lastNativeRefreshing = this.props.refreshing;
  }

  componentDidUpdate(prevProps: NativePullToRefreshHeaderProps) {
    if (this.props.refreshing !== prevProps.refreshing) {
      this._lastNativeRefreshing = this.props.refreshing;
    } else if (this.props.refreshing !== this._lastNativeRefreshing && this._nativeRef) {
      PullToRefreshHeaderCommands.setNativeRefreshing(this._nativeRef, this.props.refreshing);
      this._lastNativeRefreshing = this.props.refreshing;
    }
  }

  render(): ReactNode {
    return React.createElement(
      NativePullToRefreshHeader,
      {
        ...this.props,
        ref: this._setNativeRef,
        onRefresh: this._onRefresh
      }
    );
  }
}

export {PullToRefreshHeader};