ui support for archive items

Issue-ID: SDC-1088
Change-Id: I836e4896a8ec6bb065f9d2571f514916ccf6759f
Signed-off-by: svishnev <shlomo-stanisla.vishnevetskiy@amdocs.com>
diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
index 69a34e0..f8417fa 100644
--- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPage.jsx
@@ -1,5 +1,5 @@
 /*!
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ * Copyright © 2016-2018 European Support Limited
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -18,7 +18,26 @@
 import PermissionsView from './components/PermissionsView.jsx';
 import Tree from 'nfvo-components/tree/Tree.jsx';
 import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
+import Button from 'sdc-ui/lib/react/Button.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
+import featureToggle from 'sdc-app/features/featureToggle.js';
+
+const DepricateButton = ({depricateAction, title}) => (
+	<div className='depricate-btn-wrapper'>
+		<Button data-test-id='depricate-action-btn'	className='depricate-btn' onClick={depricateAction}>{title}</Button>
+	</div>
+);
+
+const FeatureDepricatedButton = featureToggle('ARCHIVE_ITEM')(DepricateButton);	
+
+const VersionPageTitle = ({itemName, depricatedTitle, isArchived, onRestore, onArchive}) => {
+	return (
+		<div className='version-page-header'>
+			<div className='versions-page-title'>{`${i18n('Available Versions')} - ${itemName}  ${depricatedTitle}`}</div>			
+			<FeatureDepricatedButton depricateAction={isArchived ? () => onRestore() : () => onArchive() }  title={i18n(isArchived ? 'RESTORE' : 'ARCHIVE')}/>
+		</div>
+	);
+};
 
 class VersionsPage extends React.Component {
 	state = {
@@ -26,10 +45,16 @@
 	}
 	render() {
 		let { versions, owner, contributors, currentUser, isCollaborator, itemName = '', viewers, onSelectVersion, onNavigateToVersion,
-		onTreeFullScreen, onManagePermissions, onCreateVersion, selectedVersion, onModalNodeClick, isManual} = this.props;
+		onTreeFullScreen, onManagePermissions, onCreateVersion, selectedVersion, onModalNodeClick, isManual, isArchived, onArchive, onRestore} = this.props;		
+		const depricatedTitle = isArchived ? i18n('(Archived)') : '';
 		return (
 			<div className='versions-page-view'>
-				<div className='versions-page-title'>{i18n('Available Versions - {itemName}', {itemName: itemName})}</div>
+				<VersionPageTitle 
+					itemName={itemName} 
+					depricatedTitle={depricatedTitle} 					
+					onArchive={onArchive}
+					isArchived={isArchived}
+					onRestore={onRestore}/>
 				<PermissionsView
 					owner={owner}
 					contributors={contributors}
@@ -65,7 +90,7 @@
 						versions={versions}
 						onSelectVersion={onSelectVersion}
 						onNavigateToVersion={onNavigateToVersion}
-						onCreateVersion={onCreateVersion}
+						onCreateVersion={isArchived ? false : onCreateVersion}
 						selectedVersion={selectedVersion}
 						isCollaborator={isCollaborator} />
 				</div>