import AttrList from './components/AttrList.jsx';
import JsonDisplay from './components/JsonDisplay.jsx';

function ExtendedAttributes({attributes, ...props}) {
	//console.log(attributes);

	if (!attributes) 
		return <section className="page-contents">This object has no attributes.</section>;

	const {parent, location, contents, verbs, prepositions} = attributes;

	const newAttributes = {...attributes, 
		parent: undefined,
		location: undefined,
		contents: undefined,
		verbs: undefined,
		prepositions: undefined
	}

	return <>
		<section className="page-contents">
			{parent ? 
				`The parent of this object is #${parent}.`
				:
				"This object has no parent."}
		</section>

		<section className="page-contents">
			{location ?
				`This object lives in #${location}`
				:
				"This object has no location."}
		</section>

		<AttrList 
			list={contents}
			title="Objects in this location:" />

		<AttrList
			list={verbs}
			title="Verbs defined on this object:" />

		<AttrList
			list={prepositions}
			title="Prepositions this verb expects:" />

		<JsonDisplay obj={newAttributes} />
	</>
}

export default ExtendedAttributes;