'use strict';

const React = require("react");
const createReactClass = require("create-react-class");

function debugValue(value) {
	let stringifiedValue = `${value}`;

	if (typeof value === "boolean") {
		return (<span className="boolean">{stringifiedValue}</span>);
	} else if (typeof value === "number") {
		return (<span className="number">{stringifiedValue}</span>);
	} else if (typeof value === "string") {
		return (<span className="string">{value}</span>);
	} else if (value === null) {
		return (<span className="null">null</span>);
	} else if (value === undefined) {
		return (<span className="null">undefined</span>);
	} else {
		throw new Error(`Unrecognized attribute value type`, value);
	} /* FIXME: array, object */
}

module.exports = createReactClass({
	displayName: "AstItemAttribute",
	render: function () {
		return (
			<div key={this.props.itemKey} className="attribute">
				<span className="name">{this.props.itemKey}</span>
				<span className="value">{debugValue(this.props.value)}</span>
			</div>
		);
	}
});
