Merge branch 'main' into myopencre-help-guide

Author: PRAteek-singHWY

Dockerfile-dev

@@ -1,9 +1,12 @@
 FROM node:lts AS build
 
 WORKDIR /code
-COPY . /code
-
 RUN apt-get update && apt-get install -y chromium
+COPY package.json yarn.lock ./
+RUN yarn install
+
+COPY . .
+
 RUN make install-deps-typescript && make install-typescript && make frontend
 
 FROM python:3.11.0 AS run

Makefile

@@ -40,7 +40,7 @@ dev-flask-docker:
 e2e:
 	yarn build
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP=$(CURDIR)/cre.py &&\
+	export FLASK_APP="$(CURDIR)/cre.py" &&\
 	export FLASK_CONFIG=development &&\
 	export INSECURE_REQUESTS=1 &&\
 	flask run &
@@ -52,7 +52,7 @@ e2e:
 
 test:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP=$(CURDIR)/cre.py &&\
+	export FLASK_APP="$(CURDIR)/cre.py" &&\
 	flask routes && flask test
 
 cover:
@@ -107,12 +107,12 @@ clean:
 
 migrate-upgrade:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP=$(CURDIR)/cre.py 
+	export FLASK_APP="$(CURDIR)/cre.py" 
 	flask db upgrade  
 
 migrate-downgrade:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP=$(CURDIR)/cre.py
+	export FLASK_APP="$(CURDIR)/cre.py"
 	flask db downgrade
 
 import-projects:
@@ -123,7 +123,7 @@ import-all:
 
 import-neo4j:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP=$(CURDIR)/cre.py && python cre.py --populate_neo4j_db
+	export FLASK_APP="$(CURDIR)/cre.py" && python cre.py --populate_neo4j_db
 
 preload-map-analysis:
 	$(shell RUN_COUNT=5 bash ./scripts/preload_gap_analysis.sh)

application/frontend/src/pages/Search/Search.tsx

@@ -231,8 +231,8 @@ export const SearchPage = () => {
               </div>
               <h3 className="htu-card__title">Link from your document / tool</h3>
               <p className="htu-card__text">
-                Llink with the CRE ID: <a href="https://opencre.org/cre/764-507">opencre.org/cre/764-507</a>{' '}
-                or use a familiar standard such as CWE:{' '}
+                Link with the CRE ID: <a href="https://opencre.org/cre/764-507">opencre.org/cre/764-507</a> or
+                use a familiar standard such as CWE:{' '}
                 <a href="https://opencre.org/smartlink/standard/CWE/611">
                   opencre.org/smartlink/standard/CWE/611
                 </a>
@@ -257,7 +257,7 @@ export const SearchPage = () => {
 
         <div id="features" className="section">
           <div className="features-grid">
-            <div className="feature-block feature-block--rose">
+            {/* <div className="feature-block feature-block--rose">
               <div className="feature-block__icon-wrapper">
                 <MessageSquare className="icon" />
               </div>
@@ -272,6 +272,29 @@ export const SearchPage = () => {
                 This ensures you get a more <strong>reliable answer</strong>, and also a reference to a{' '}
                 <strong>reputable source</strong>.
               </p>
+            </div> */}
+            <div className="feature-block feature-block--rose">
+              <div className="feature-block__icon-wrapper">
+                <MessageSquare className="icon" />
+              </div>
+              <h3 className="feature-block__title">OPENCRE CHAT</h3>
+
+              <div className="feature-block__text space-y-2">
+                <p>
+                  Use{' '}
+                  <strong>
+                    <a href="https://www.opencre.org/chatbot">OpenCRE Chat</a>
+                  </strong>{' '}
+                  to ask any security question.
+                </p>
+
+                <p>
+                  In collaboration with <strong>Google</strong>, we injected all the standards in OpenCRE into
+                  an AI model to create the most comprehensive security chatbot. This ensures you get a more{' '}
+                  <strong>reliable answer</strong>, and also a reference to a{' '}
+                  <strong>reputable source</strong>.
+                </p>
+              </div>
             </div>
             <div className="feature-block feature-block--teal">
               <div className="feature-block__icon-wrapper">
@@ -281,8 +304,11 @@ export const SearchPage = () => {
                 <a href="https://www.opencre.org/map_analysis">MAP ANALYSIS</a>
               </h3>
               <p className="feature-block__text">
-                Utilize <strong><a href="/map_analysis">Map Analysis</a></strong> as a tool to explore and understand the connections
-                between two standards.
+                Utilize{' '}
+                <strong>
+                  <a href="/map_analysis">Map Analysis</a>
+                </strong>{' '}
+                as a tool to explore and understand the connections between two standards.
               </p>
               <p className="feature-block__text">
                 See how <strong>any two standards connect</strong> with each other, providing valuable

application/frontend/src/pages/Search/search.scss

@@ -1024,16 +1024,18 @@ body {
   z-index: 10;
   width: 100%;
   border-top: 1px solid rgba(var(--border-rgb), 0.5);
-  padding: 3rem 0;
+  padding: 4rem 0; // ⬅ slightly more breathing room
   backdrop-filter: blur(4px);
 
   &__container {
     max-width: 112rem;
     margin: 0 auto;
     padding: 0 1rem;
+
     @media (min-width: 640px) {
       padding: 0 1.5rem;
     }
+
     @media (min-width: 1024px) {
       padding: 0 2rem;
     }
@@ -1042,53 +1044,67 @@ body {
   &__grid {
     display: grid;
     grid-template-columns: 1fr;
-    gap: 2rem;
+    gap: 2.5rem;
+    align-items: start;
+
     @media (min-width: 768px) {
-      grid-template-columns: repeat(4, 1fr);
+      grid-template-columns: 1.2fr 1fr 1fr 1fr; // ⬅ brand slightly wider
+      gap: 3.5rem;
     }
   }
 
   &__about {
     display: flex;
     flex-direction: column;
-    gap: 1rem;
+    gap: 1.25rem;
+    max-width: 30rem;
+
     .logo-link {
       display: flex;
       align-items: center;
       gap: 0.5rem;
+
       img {
-        height: 10rem;
-        width: 10rem;
+        height: 2rem; // ⬅ reduced from 2.25rem
+        width: auto;
       }
     }
+
     p {
       color: var(--muted-foreground);
+      line-height: 1.6;
+      font-size: 0.95rem;
     }
   }
 
   &__links-column {
     .column-title {
       color: white;
       font-weight: 500;
-      margin-bottom: 1rem;
+      font-size: 0.95rem;
+      letter-spacing: 0.02em;
+      margin-bottom: 1.1rem;
     }
+
     .links-list {
       display: flex;
       flex-direction: column;
-      gap: 0.5rem;
+      gap: 0.55rem;
+
       a {
         display: block;
         color: var(--muted-foreground);
-        transition: color 0.3s;
+        font-size: 0.9rem;
+        transition: color 0.25s ease;
         text-decoration: none;
+
         &:hover {
           color: var(--foreground);
         }
       }
     }
   }
 }
-
 .loading-screen {
   min-height: 100vh;
   background-color: var(--background);

application/frontend/src/scaffolding/Header/header.scss

@@ -41,8 +41,9 @@
   gap: 0.5rem;
   margin-left: 4rem;
   img {
-    height: 10rem;
+    height: 4rem;
     width: 10rem;
+    display: block;
   }
 }
 

tsconfig.json

@@ -12,7 +12,6 @@
     "lib": ["esnext", "dom"],
     "outDir": "dist",
     "moduleResolution": "node",
-    "keyofStringsOnly": true,
     "skipLibCheck": true,
     "esModuleInterop": true
   },