// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. // See License.txt for license information. import $ from 'jquery'; import React from 'react'; import * as SyntaxHighlighting from 'utils/syntax_highlighting.jsx'; import Constants from 'utils/constants.jsx'; import FileInfoPreview from './file_info_preview.jsx'; import loadingGif from 'images/load.gif'; export default class CodePreview extends React.Component { constructor(props) { super(props); this.updateStateFromProps = this.updateStateFromProps.bind(this); this.handleReceivedError = this.handleReceivedError.bind(this); this.handleReceivedCode = this.handleReceivedCode.bind(this); this.state = { code: '', lang: '', loading: true, success: true }; } componentDidMount() { this.updateStateFromProps(this.props); } componentWillReceiveProps(nextProps) { if (this.props.fileUrl !== nextProps.fileUrl) { this.updateStateFromProps(nextProps); } } updateStateFromProps(props) { const usedLanguage = SyntaxHighlighting.getLanguageFromFileExtension(props.fileInfo.extension); if (!usedLanguage || props.fileInfo.size > Constants.CODE_PREVIEW_MAX_FILE_SIZE) { this.setState({code: '', lang: '', loading: false, success: false}); return; } this.setState({code: '', lang: usedLanguage, loading: true}); $.ajax({ async: true, url: props.fileUrl, type: 'GET', dataType: 'text', error: this.handleReceivedError, success: this.handleReceivedCode }); } handleReceivedCode(data) { let code = data; if (data.nodeName === '#document') { code = new XMLSerializer().serializeToString(data); } this.setState({ code, loading: false, success: true }); } handleReceivedError() { this.setState({loading: false, success: false}); } static supports(fileInfo) { return Boolean(SyntaxHighlighting.getLanguageFromFileExtension(fileInfo.extension)); } render() { if (this.state.loading) { return (
{strlines}