add notInteractive to articles

src/app/pacto/[id]/page.jsx

@@ -9,14 +9,11 @@ import { Suspense } from "react";
 export default async function Propuesta({params:{id}, searchParams:{version}}) {
     const project = await fetchProjectId(id,version)
     if (project) return (<div className="pacto-wrapper ">
-        <Suspense fallback={<Skeleton height={700} column/>}>
             <BreadcrumbNav project={project} section="resumen" version={version}/>
             <HeaderPropuesta project={project} section="resumen" />
             <div className="project-body-container">
                 <ResumenBody project={project} />
             </div>
-
-        </Suspense>
     </div>)
     else return (<div className="content pacto-wrapper has-text-centered">
         <h1 className='my-6'>Todavia no hay pacto</h1>

src/components/pacto/body/pacto/article.jsx

@@ -17,7 +17,6 @@ export default function Article({ project, article }) {
     const [dislikes, setDislikes] = useState(article.dislikes);
     const [showComments, setShowComments] = useState(false);
     const { language } = useLanguage();
-
     const handleLike = async () => {
         const resp = await toLike(
             `/projects/${project._id}/articles/${article._id}`
@@ -60,7 +59,7 @@ export default function Article({ project, article }) {
     return (
         <div className="columns mx-0 article my-4">
             <div className="column  is-11 is-12-touch">
-                <div className="card card-article">
+                <div className={"card " + (article.notInteractive ? "card-article-title" : "card-article")}>
                     <div className="card-content is-size-5 columns mx-0">
                         <div className="content w-100 is-size-7-touch">
                             <Remark>
@@ -70,7 +69,7 @@ export default function Article({ project, article }) {
                             </Remark>
                         </div>
                     </div>
-                    <footer
+                    {!article.notInteractive && <footer
                         className={`card-footer has-background-primary is-flex is-justify-content-space-between is-relative ${
                             project.version !== project.currentVersion
                                 ? "disabled"
@@ -142,7 +141,7 @@ export default function Article({ project, article }) {
                                 <FontAwesomeIcon icon={faComment} /> Comentar
                             </button>
                         </div>
-                    </footer>
+                    </footer>}
                 </div>
             </div>
             {showComments && (

src/components/pacto/form/articleForm.jsx

@@ -9,6 +9,8 @@ const ArticleForm = forwardRef(({ article, moveArticleUp, moveArticleDown, toggl
   const [articleId] = useState(article._id || null);
   const [text_es, setText_es] = useState(article.text_es || '');
   const [text_pt, setText_pt] = useState(article.text_pt || '');
+  const [notInteractive, setNotIteractive] = useState(article.notInteractive || false)
+
   // const [position, setPosition] = useState(article.position || 1);
   const summary_es_ref = useRef(null);
   const summary_pt_ref = useRef(null);
@@ -31,6 +33,7 @@ const ArticleForm = forwardRef(({ article, moveArticleUp, moveArticleDown, toggl
       }
       if(deleted) output.deleted = true
       if(articleId) output._id = articleId
+      output.notInteractive = notInteractive
       return output
     },
     getCurrentTextEs() {
@@ -66,12 +69,17 @@ const ArticleForm = forwardRef(({ article, moveArticleUp, moveArticleDown, toggl
     setDeleted(!deleted)
   }
 
+
   return (
     <div className='article-wrapper'>
       <div className='mb-4'>
         <div className="is-flex is-justify-content-space-between is-align-items-center is-justify-content-top">
           <h3 className="title is-5 mb-0">Artículo {!articleId && <span className="tag is-primary">Nuevo</span> }</h3>
           <div className="is-flex">
+          <label className="checkbox mr-4">
+            <input type="checkbox" checked={!notInteractive} onChange={()=>setNotIteractive(!notInteractive)} />
+              Interactivo
+            </label>
             <div className="is-clickable"><FontAwesomeIcon className="" icon={faCaretSquareUp} onClick={clickArticleUp}/></div>
             <div className="is-clickable ml-4"><FontAwesomeIcon className="" icon={faSquareCaretDown} onClick={clickArticleDown} /></div>
             {
@@ -98,6 +106,5 @@ const ArticleForm = forwardRef(({ article, moveArticleUp, moveArticleDown, toggl
   )
 })
 
-ArticleForm.displayName = 'ArticleForm';
 
 export default ArticleForm;

src/components/pacto/form/projectForm.jsx

@@ -78,6 +78,7 @@ export default function ProjectFormComponent({project, newVersion}) {
         clientId: getRandomClientId(),
         text_es: article.text_es,
         text_pt: article.text_pt,
+        notInteractive: article.notInteractive,
       }
     })
   }

src/components/pacto/header/index.jsx

@@ -1,10 +1,8 @@
-import UserAvatar from "../../common/user-avatar";
 import ClosingDate from "../../common/closing-date";
 import ArticlesCommentsCounter from "../../common/article-comment-counter";
 import ProjectHeaderVersion from "../../common/project-version";
 import ProgressBar from "../../common/progresBar";
 import ClosingProject from "../../common/closing-project";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faShareNodes } from "@fortawesome/free-solid-svg-icons";
 import Link from "next/link";
 import StageProject from "@/components/common/stage-project";

src/static/scss/pacto.scss

@@ -283,6 +283,10 @@
       }
 
       .article {
+        .card-article-title {
+          border: none!important;
+          box-shadow: none!important;
+        }
         .card-article {
           .card-footer {
             padding: 0.5rem 1rem;