Add collaboration feature

[sdc.git] / openecomp-ui / src / nfvo-components / overlay / Overlay.jsx

diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogTile.jsx b/openecomp-ui/src/nfvo-components/overlay/Overlay.jsx
similarity index 61%
rename from openecomp-ui/src/sdc-app/onboarding/onboard/CatalogTile.jsx
rename to openecomp-ui/src/nfvo-components/overlay/Overlay.jsx
index c7720a9..054c1e2 100644 (file)
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogTile.jsx
+++ b/openecomp-ui/src/nfvo-components/overlay/Overlay.jsx
@@ -13,19 +13,28 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
+
 import React from 'react';
+import enhanceWithClickOutside from 'react-click-outside';
 
-const CatalogTile = ({catalogItemTypeClass, onSelect, children}) => {
-       return(
-               <div className={`catalog-tile tile ${catalogItemTypeClass}`} onClick={(e) => {e.stopPropagation(); e.preventDefault(); onSelect();}} data-test-id={catalogItemTypeClass}>
-                       {children}
-               </div>
-       );
-};
+class Overlay extends React.Component {
+
+       handleClickOutside() {
+               if (this.props.onClose) {
+                       this.props.onClose();
+               }
+       }
+
+       render() {
+               return (
+                       <div className='onboarding-overlay'>
+                               <div className='arrow-up'></div>
+                               <div className='arrow-border'/>
+                               {this.props.children}
+                       </div>
+               );
+       }
 
-CatalogTile.PropTypes = {
-       catalogItemTypeClass: React.PropTypes.string,
-       onSelect: React.PropTypes.func
 };
 
-export default CatalogTile;
+export default enhanceWithClickOutside(Overlay);