Added all new common files related to onboarding and workflow suggestions

frontend/src/components/SecurityFramework.jsx

@@ -1,6 +1,6 @@
 import React, {useState } from 'react';
 import {isMobile} from "react-device-detect";
-import DetectionFramework, { usecases } from "../components/DetectionFramework.jsx";
+import AppFramework, { usecases } from "../components/AppFramework.jsx";
 import {Link} from 'react-router-dom';
 import ReactGA from 'react-ga';
 
@@ -56,6 +56,8 @@ export const securityFramework = [
 ]
 
 const LandingpageUsecases = (props) => {
+	const { userdata } = props
+
 	const [selectedUsecase, setSelectedUsecase] = useState("Phishing")
 	const usecasekeys = usecases === undefined || usecases === null ? [] : Object.keys(usecases)
 	const buttonBackground = "linear-gradient(to right, #f86a3e, #f34079)"
@@ -169,7 +171,12 @@ const LandingpageUsecases = (props) => {
 				</div>
 				{isMobile ? null : 
 					<div style={{marginLeft: 200, marginTop: 125, zIndex: 1000}}>
-						<DetectionFramework showOptions={false} selectedOption={selectedUsecase} rolling={true} />
+						<AppFramework
+							userdata={userdata} 
+							showOptions={false} 
+							selectedOption={selectedUsecase} 
+							rolling={true} 
+						/>
 					</div>
 				}
 				{isMobile ? null :