center-for-threat-informed-defense · mikecarenzo · Sep 6, 2024 · Jul 19, 2024 · Jul 19, 2024 · Jul 19, 2024
diff --git a/.github/workflows/build_website.yml b/.github/workflows/build_website.yml
@@ -59,20 +59,20 @@ jobs:
         run: npm run type-check
 
       # Configure Python
-      - uses: actions/setup-python@v4
-        with:
-          python-version: '3.11.8'
-      - name: Install Poetry
-        run: curl -sSL https://install.python-poetry.org/ | python -
-      - name: Add Poetry to PATH
-        run: echo "$HOME/.poetry/bin" >> $GITHUB_PATH
-      - name: Install dependencies
-        run: poetry install
+      # - uses: actions/setup-python@v4
+      #   with:
+      #     python-version: '3.11.8'
+      # - name: Install Poetry
+      #   run: curl -sSL https://install.python-poetry.org/ | python -
+      # - name: Add Poetry to PATH
+      #   run: echo "$HOME/.poetry/bin" >> $GITHUB_PATH
+      # - name: Install dependencies
+      #   run: poetry install
 
       # Train Model
-      - name: Retrain Technique Inference Engine Model
-        working-directory: src/tie-web-interface/
-        run: npm run build-model
+      # - name: Retrain Technique Inference Engine Model
+      #   working-directory: src/tie-web-interface/
+      #   run: npm run build-model
 
       # Build Website
       - name: Compile Website

diff --git a/data/data collection/README b/data/data collection/README
@@ -0,0 +1,20 @@
+# Obtaining Annotated Reports from OpenCTI:
+
+- OpenCTI has reports that come in daily, over 13,000 total reports and some of them have TTPs
+
+Steps to Get Reports from OpenCTI using the Jupyter Notebook here: OpenCTI Reports to TTPs (shareable).ipynb
+
+1. Specify the URL for your OpenCTI instance and set your API key in the corresponding field in the script.
+
+2. Run the first few cells to import the necessary libraries and connect to the OpenCTI instance.
+
+3. Run the cell that contains the Query to obtain all report objects in OpenCTI via GraphQL to obtain list of report IDs. This list of report IDs will have to be iterated on next. It will grab two report IDs for all reports present in the database.
+
+   - GraphQL queries have been formulated within MITRE to collect the necessary fields. This query is just looking for reports and the fields attached to it can be modified within the script if additional information is needed.
+
+4. Run the next query to use the the Report’s ID field as input to collect all the TTPs linked with the ReportID; each query runs independently using the single report ID and then returns the data with the ATT&CK techniques. The loop will finish once every report is checked for TTPs; discarding any reports that return an empty list.
+
+   - If additional information beyond TTPs is needed from each report, you can add any other fields (e.g., description, publication date, etc.) to return from OpenCTI.
+
+5. Parse the JSON response to filter out any non-Enterprise ATT&CK techniques (since OpenCTI also contains other domains like mobile and ICS techniques) duplicate URLs/TTP combinations, and only use TLP-clear field.
+
diff --git a/src/tie-web-interface/.gitignore b/src/tie-web-interface/.gitignore
@@ -30,4 +30,4 @@ coverage
 *.tsbuildinfo
 
 # Ignore Model
-app.trained.model.zip
+# app.trained.model.zip
diff --git a/src/tie-web-interface/index.html b/src/tie-web-interface/index.html
@@ -19,6 +19,26 @@
 
     gtag('config', 'G-NLXWXCSGXF', { 'anonymize_ip': true });
   </script>
+  <script>
+    window.MathJax = {
+      tex: {
+        inlineMath: [
+          ["$", "$"],
+          ["\\(", "\\)"],
+        ],
+        displayMath: [
+          ["$$", "$$"],
+          ["\\[", "\\]"],
+        ],
+        processEscapes: true,
+      },
+      options: {
+        ignoreHtmlClass: "tex2jax_ignore",
+        processHtmlClass: "tex2jax_process",
+      },
+    };
+  </script>
+  <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
 </head>
 
 <body>

diff --git a/src/tie-web-interface/public/app.trained.model.zip b/src/tie-web-interface/public/app.trained.model.zip
diff --git a/src/tie-web-interface/public/favicon.ico b/src/tie-web-interface/public/favicon.ico
diff --git a/src/tie-web-interface/public/images/python_notebook_retina.png b/src/tie-web-interface/public/images/python_notebook_retina.png
diff --git a/src/tie-web-interface/public/images/python_notebook_standard.png b/src/tie-web-interface/public/images/python_notebook_standard.png
diff --git a/src/tie-web-interface/src/App.vue b/src/tie-web-interface/src/App.vue
@@ -40,42 +40,33 @@ export default defineComponent({
       },
       {
         name: "About",
-        url: "/about",
+        url: "/#/about",
         sections: [
           {
             name: "Learn More",
             description: "Learn about the project.",
-            url: "/about"
+            url: "/#/about"
           },
           {
-            name: "Methodology",
-            description: "Learn how we trained the model.",
-            url: "/about"
+            name: "Our Dataset",
+            description: "Learn about our training data.",
+            url: "/#/about/#dataset"
           }
         ]
       },
       {
-        name: "Methodology",
-        url: "/about"
-      },
-      {
-        name: "Help",
-        url: "/about",
+        name: "Resources",
+        url: "/#/resources",
         sections: [
           {
-            name: "Predicting Techniques",
-            description: "Learn how to predict Techniques.",
-            url: "/about"
-          },
-          {
-            name: "Tuning the Model",
-            description: "Learn how to tune the model.",
-            url: "/about"
+            name: "Use the Python Notebook",
+            description: "Run the Engine locally on your machine.",
+            url: "/#/resources/"
           },
           {
             name: "Contribute",
             description: "Learn how to contribute.",
-            url: "/about"
+            url: "https://github.com/center-for-threat-informed-defense/technique-inference-engine"
           }
         ]
       },
@@ -92,7 +83,7 @@ export default defineComponent({
 });
 </script>
 
-<style>
+<style lang="scss">
 #app {
   display: flex;
   flex-direction: column;

diff --git a/src/tie-web-interface/src/assets/styles/engenuity_color_system.scss b/src/tie-web-interface/src/assets/styles/engenuity_color_system.scss
@@ -235,6 +235,15 @@ var {
   background: var(--tag-background);
 }
 
+blockquote {
+  border-color: var(--primary-font);
+  background: var(--tag-background);
+}
+
+.codeblock {
+  background: var(--accent-2-border);
+}
+
 @mixin placeholder {
   color: var(--field-border)
 }

diff --git a/src/tie-web-interface/src/assets/styles/engenuity_scaling_system.scss b/src/tie-web-interface/src/assets/styles/engenuity_scaling_system.scss
@@ -566,6 +566,20 @@ var { @include var }
 }
 code { @include code }
 
+@mixin blockquote {
+  padding: size("m") size("l");
+  border-left-style: solid;
+  border-left-width: 4px;
+}
+blockquote { @include blockquote }
+
+@mixin codeblock {
+  @include code;
+  display: block;
+  padding: size("m") size("l");
+}
+.codeblock { @include codeblock }
+
 @mixin placeholder {
   font-family: "Oswald";
   font-weight: 400;

diff --git a/src/tie-web-interface/src/components/Controls/NavigationFooter.vue b/src/tie-web-interface/src/components/Controls/NavigationFooter.vue
@@ -56,33 +56,49 @@
             <div class="link-list">
               <h5>Related Projects</h5>
               <ul>
-                <li><a href="/">Attack Flow</a></li>
-                <li><a href="/about">Mappings Explorer</a></li>
-                <li><a href="/about">Summiting the Pyramid</a></li>
-                <li><a href="/about">TRAM</a></li>
+                <li>
+                  <a href="https://center-for-threat-informed-defense.github.io/attack-flow/">
+                    Attack Flow
+                  </a>
+                </li>
+                <li>
+                  <a href="https://center-for-threat-informed-defense.github.io/mappings-explorer/">
+                    Mappings Explorer
+                  </a>
+                </li>
+                <li>
+                  <a href="https://center-for-threat-informed-defense.github.io/summiting-the-pyramid/">
+                    Summiting the Pyramid
+                  </a>
+                </li>
+                <li>
+                  <a href="https://github.com/center-for-threat-informed-defense/tram/wiki">
+                    TRAM
+                  </a>
+                </li>
               </ul>
             </div>
             <div class="link-list">
               <h5>TIE</h5>
               <ul>
                 <li>
-                  <a href="#">
+                  <a href="/#/">
                     Home
                   </a>
                 </li>
                 <li>
-                  <a href="#">
+                  <a href="/#/about">
                     About
                   </a>
                 </li>
                 <li>
-                  <a href="#">
-                    Methodology
+                  <a href="/#/about/#dataset">
+                    Our Dataset
                   </a>
                 </li>
                 <li>
-                  <a href="#">
-                    Help
+                  <a href="/#/resources">
+                    Resources
                   </a>
                 </li>
               </ul>
@@ -92,7 +108,7 @@
 
         <div class="disclosures-section">
           <small>
-            Copyright © 2024 MITRE Engenuity. Approved for public release. Document number(s) PUT_PRS_NUMBER_HERE.
+            Copyright © 2024 MITRE Engenuity. Approved for public release. Document number(s) CT0124.
           </small>
         </div>
 

diff --git a/src/tie-web-interface/src/components/Controls/NavigationHeader.vue b/src/tie-web-interface/src/components/Controls/NavigationHeader.vue
@@ -12,17 +12,17 @@
           <ul class="page-links">
             <template v-for="l of pageLinks" :key="l.name">
               <li class="page-link link-hover-trigger">
-                <RouterLink class="primary-link" :to="l.url">
+                <a class="primary-link" :href="l.url">
                   {{ l.name }}<span class="dropdown" v-if="l.sections?.length"></span>
-                </RouterLink>
+                </a>
                 <div class="section-links-container" v-if="l.sections?.length">
                   <ul class="section-links theme-light">
                     <template v-for="s of l.sections" :key="s.name">
                       <li class="section-link section-name-hover-trigger">
-                        <RouterLink :to="s.url">
+                        <a :href="s.url">
                           <p class="section-name">{{ s.name }}</p>
                           <p class="section-description">{{ s.description }}</p>
-                        </RouterLink>
+                        </a>
                       </li>
                     </template>
                   </ul>

diff --git a/src/tie-web-interface/src/router/index.ts b/src/tie-web-interface/src/router/index.ts
@@ -1,8 +1,8 @@
-import { createRouter, createWebHistory } from 'vue-router'
+import { createRouter, createWebHashHistory } from 'vue-router'
 import HomeView from '../views/HomeView.vue'
 
 const router = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
+  history: createWebHashHistory(import.meta.env.BASE_URL),
   routes: [
     {
       path: '/',
@@ -12,12 +12,27 @@ const router = createRouter({
     {
       path: '/about',
       name: 'about',
-      // route level code-splitting
-      // this generates a separate chunk (About.[hash].js) for this route
-      // which is lazy-loaded when the route is visited.
       component: () => import('../views/AboutView.vue')
+    },
+    {
+      path: '/about',
+      name: 'about',
+      component: () => import('../views/AboutView.vue')
+    },
+    {
+      path: '/resources',
+      name: 'resources',
+      component: () => import('../views/ResourcesView.vue')
+    }
+  ],
+  scrollBehavior: function (to) {
+    if (to.hash) {
+      // Constant top value not ideal, but it works for now
+      return { el: to.hash, top: 120 }
+    } else {
+      return { top: 0 }
     }
-  ]
+  }
 })
 
 export default router