diff --git a/ui/src/console/detail/access/AccessDetail.js b/ui/src/console/detail/access/AccessDetail.js
index 07299597..455fa016 100644
--- a/ui/src/console/detail/access/AccessDetail.js
+++ b/ui/src/console/detail/access/AccessDetail.js
@@ -9,7 +9,7 @@ const AccessDetail = (props) => {
     const [detail, setDetail] = useState({});
 
     useEffect(() => {
-        getFrontendDetail(props.selection.id)
+        getFrontendDetail(props.selection.feId)
             .then(resp => {
                 setDetail(resp.data);
             });
diff --git a/ui/src/console/visualizer/graph.js b/ui/src/console/visualizer/graph.js
index afbd1e82..cb2efb2a 100644
--- a/ui/src/console/visualizer/graph.js
+++ b/ui/src/console/visualizer/graph.js
@@ -74,7 +74,8 @@ export const mergeGraph = (oldGraph, user, accountLimited, newOverview) => {
             if(env.frontends) {
                 env.frontends.forEach(fe => {
                    let feNode = {
-                       id: fe.id,
+                       id: "fe:" + fe.id,
+                       feId: fe.id,
                        target: fe.shrToken,
                        label: fe.shrToken,
                        type: "frontend",