<commit_before>import * as RNFS from "react-native-fs";
import RNFetchBlob from 'react-native-fetch-blob';
import React, {Component} from "react";
import {Image} from "react-native";
import MstUtil from "../../lib/model/MstUtil";

export class CacheImage extends Component<any, any> {

    private _url: string;

    constructor(props, context) {
        super(props, context);

        this._url = props.url;

        this.state = {
            data: undefined
        }
    }

    componentWillMount() {
        this.loadImage().catch((err) => console.error(err));
    }

    async loadImage(): Promise<any> {
        let split = this._url.split("/");
        let fileName = split.pop();
        let type = split.pop();
        let localFilePath;

        let imageBasePath = await MstUtil.instance.getLocalImagePath();
        localFilePath = `${imageBasePath}/${type}/${fileName}`;

        let exists = await RNFS.exists(localFilePath);

        let base64Str = "";
        if (exists) {
            base64Str = await MstUtil.instance.readImageIntoBase64Str(localFilePath);
        } else {
            //noinspection TypeScriptValidateTypes
            await RNFetchBlob.config({
                path: localFilePath
            }).fetch("GET", this._url);
            //noinspection TypeScriptUnresolvedVariable
            base64Str = await MstUtil.instance.readImageIntoBase64Str(localFilePath);
        }

        this.setState({
            data: {
                uri: base64Str
            }
        });
    }

    render() {
        //noinspection TypeScriptUnresolvedVariable
        return (
            <Image
                {...this.props}
                defaultSource={require("./unknown.png")}
                source={this.state.data}
            /><commit_msg>Fix the lifecycle controlling issue of CacheImage.<commit_after>import * as RNFS from "react-native-fs";
import RNFetchBlob from 'react-native-fetch-blob';
import React, {Component} from "react";
import {Image} from "react-native";
import MstUtil from "../../lib/model/MstUtil";

interface State {
    data: ImageSource;
}
interface ImageSource {
    uri: string;
}

export class CacheImage extends Component<any, any> {

    private _isMounted: boolean;
    private _url: string;

    constructor(props, context) {
        super(props, context);

        this._isMounted = false;
        this._url = props.url;

        this.state = {
            data: undefined
        } as State;
    }

    componentDidMount() {
        this._isMounted = true;
        this.loadImage().then((base64) => {
            this.updateState({
                data: {uri: base64}
            });
        }).catch((err) => {
            console.error(err);
        });
    }

    componentWillUnmount () {
        this._isMounted = false;
    }

    updateState(state: any) {
        if (!this._isMounted) {
            return;
        }
        this.setState(state);
    }

    async loadImage(): Promise<string> {
        let split = this._url.split("/");
        let fileName = split.pop();
        let type = split.pop();
        let localFilePath;

        let imageBasePath = await MstUtil.instance.getLocalImagePath();
        localFilePath = `${imageBasePath}/${type}/${fileName}`;

        let exists = await RNFS.exists(localFilePath);

        let base64Str = "";
        if (exists) {
            base64Str = await MstUtil.instance.readImageIntoBase64Str(localFilePath);
        } else {
            //noinspection TypeScriptValidateTypes
            await RNFetchBlob.config({
                path: localFilePath
            }).fetch("GET", this._url);
            //noinspection TypeScriptUnresolvedVariable
            base64Str = await MstUtil.instance.readImageIntoBase64Str(localFilePath);
        }

        return Promise.resolve(base64Str);
    }

    render() {
        //noinspection TypeScriptUnresolvedVariable
        return (
            <Image
                {...this.props}
                defaultSource={require("./unknown.png")}
                source={this.state.data}
            />
{'fraction_non_alphanumeric': 0.11846946284032377, 'fraction_numerical': 0.006867794947265146, 'mean_word_length': 1.965818181818182, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 12, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4613614', 'n_tokens_mistral': 1140, 'n_tokens_neox': 1103, 'n_words': 235}