Menus in editor

src/Tools/_framework/Panels/NewSupportPanel.jsx

@@ -1,70 +1,63 @@
 import React from 'react';
 import styled from 'styled-components';
 import {
-  useRecoilCallback,
+   useRecoilValue,
 } from 'recoil';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faQuestionCircle } from '@fortawesome/free-solid-svg-icons';
+import Button from '../../../_reactComponents/PanelHeaderComponents/Button';
+import { useNavigate } from 'react-router';
+import { searchParamAtomFamily } from '../NewToolRoot';
+// import { courseIdAtom } from '../../../_reactComponents/Course/CourseActions';
 
 const SupportWrapper = styled.div`
   overflow: auto;
   grid-area: supportPanel;
   background-color: var(--canvas);
   height: 100%;
   display: ${({$hide})=> $hide ? 'none' : 'block' }
-  // border-radius: 0 0 4px 4px;
 `;
 
 const ControlsWrapper = styled.div`
   overflow: auto;
   grid-area: supportControls;
-  display: flex;
-  gap: 4px;
+  column-gap: 10px;
+  display: ${({$hide})=> $hide ? 'none' : 'flex' };
+  justify-content:flex-end;
   background-color: var(--canvas);
-  display: ${({$hide})=> $hide ? 'none' : 'block' }
-  // border-radius: 4px 4px 0 0;
-  // border-bottom: 2px solid var(--mainGray);
-
 `;
 
+
+
 export default function SupportPanel({ hide, children, panelTitles=[], panelIndex }) {
   // console.log(">>>===SupportPanel")
-
-  const setSupportPanelIndex = useRecoilCallback(({set})=>(index)=>{
+  const navigate = useNavigate();
+  const doenetId = useRecoilValue(searchParamAtomFamily('doenetId'))
+  /* const courseId = useRecoilValue(courseIdAtom) */
 
-    console.log(">>>TODO: change SupportPanelIndex to ",index)
-  })
+
+  /* const setSupportPanelIndex = useRecoilCallback(({set})=>(index)=>{
 
-  let panelSelector = null;
+    console.log(">>>TODO: change SupportPanelIndex to ",index) 
+  }) */
+
+  /* let panelSelector = null;
   if (panelTitles.length > 0){
-
+    
     let options = [];
     for (let [i,name] of Object.entries(panelTitles)){
       options.push(<option key={`panelSelector${i}`} value={i}>{name}</option>)
     }
-
+    
     panelSelector = <select value={panelIndex} onChange={(e)=>{setSupportPanelIndex(e.target.value)}} >
-      {options}
+    {options}
     </select>
-  }
-
-  return (
-    <>
-      {/* <ControlsWrapper $hide={hide}>{panelSelector}</ControlsWrapper> */}
+  } */
+    return (
+      <>
       <ControlsWrapper $hide={hide} aria-label="complementary controls" data-test="Support Panel Controls">
-        <a href="/public?tool=editor&doenetId=_DG5JOeFNTc5rpWuf2uA-q" target="_blank">
-          <FontAwesomeIcon 
-            icon={faQuestionCircle} 
-            style={{fontDecoration: 'none', 
-              color: 'black', 
-              float:'right', 
-              marginTop: '8px', 
-              marginRight: '8px', 
-              height: '20px', 
-              width: '20px'}}/>
-        </a>
+        <Button value="Settings" onClick={()=>navigate(`/portfolio/${doenetId}/settings`)}/>
+        <Button value="Documentation" onClick={()=>window.open("/public?tool=editor&doenetId=_DG5JOeFNTc5rpWuf2uA-q")}/>
       </ControlsWrapper>
-      <SupportWrapper  $hide={hide} role="complementary" data-test="Support Panel">{children}</SupportWrapper>
+    <SupportWrapper  $hide={hide} role="complementary" data-test="Support Panel">{children}</SupportWrapper>
     </>
   );
 }

src/Tools/_framework/Paths/Portfolio.jsx

@@ -1,4 +1,4 @@
-import axios from 'axios';
+// import axios from 'axios';
 import React from 'react';
 import { redirect, Form, useOutletContext, useLoaderData } from 'react-router-dom';
 import styled from 'styled-components';
@@ -7,7 +7,7 @@ import Button from '../../../_reactComponents/PanelHeaderComponents/Button';
 export async function action() {
   //Create a portfilio activity and redirect to the editor for it
   let response = await fetch("/api/createPortfolioActivity.php");
-console.log("response",response)
+
       if (response.ok) {
         let { doenetId, pageDoenetId } = await response.json();
         return redirect(`/portfolio?tool=editor&doenetId=${doenetId}&pageId=${pageDoenetId}`);

src/Tools/_framework/Paths/PortfolioActivitySettings.jsx

@@ -173,7 +173,7 @@ export function PortfolioActivitySettings(){
         uploadData.append('file',image);
         uploadData.append('doenetId',data.doenetId);
             axios.post('/api/upload.php',uploadData).then(({data})=>{
-        console.log("RESPONSE data>",data)
+        // console.log("RESPONSE data>",data)
 
         //uploads are finished clear it out
         numberOfFilesUploading.current = 0;