ATR-18 Structurizr for Arc42 stuff only + enabled diagram embedding

Author: maxbilbow

.gitignore

@@ -1,5 +1,4 @@
 /site
 **/.DS_Store
-/workspace.json
-/.structurizr
-/.vscode/settings.json
+/.vscode/settings.json
+.idea

compose.yaml

@@ -4,6 +4,10 @@ services:
         container_name: ng2r-structurizr-lite
         restart: always
         volumes:
-            - ./docs:/usr/local/structurizr
+            - ./structurizr:/usr/local/structurizr/ng2react
+            - ./docs/images:/usr/local/structurizr/ng2react/arc42/images:ro
+            - ./docs/diagrams:/usr/local/structurizr/ng2react/arc42/diagrams:ro
+        environment:
+            - STRUCTURIZR_WORKSPACE_PATH=ng2react
         ports:
             - 9000:8080

docs/.gitignore

@@ -1,3 +1 @@
-/workspace.json
-/.structurizr
 /.vscode/settings.json

mkdocs.yml

@@ -2,7 +2,6 @@ site_name: AngularJS to React
 site_url: https://marketplace.visualstudio.com/items?itemName=maxbilbow.ng2react-vscode&ssr=false#overview
 nav:
     - Home: index.md
-    - Arc24: arc42.md
     - Extensions: VSCode.md
     - "@ng2react/support": ng2react-support.md 
     - About: about.md

structurizr/.gitignore

@@ -0,0 +1,2 @@
+workspace.json
+.structurizr

docs/arc42.md renamed to structurizr/arc42/arc42.md

@@ -1,16 +1,10 @@
 **NG2React**
 
-# Introduction and Goals
-
-Describes the relevant requirements and the driving forces that software
-architects and development team must consider. These include
-
--   underlying business goals, essential features and functional
-    requirements for the system
+![](images/icon.png)
 
--   quality goals for the architecture
+# Introduction and Goals
 
--   relevant stakeholders and their expectations
+The overarching aim is to leverage the capabilities of GPT-4 to significantly reduce the time and effort needed to migrate an AngularJS codebase to React.
 
 ## Requirements Overview
 
@@ -247,7 +241,7 @@ level without disclosing implementation details.
 The building block view is a hierarchical collection of black boxes and
 white boxes (see figure below) and their descriptions.
 
-![Hierarchy of building blocks](images/05_building_blocks-EN.png)
+![Hierarchy of building blocks](../images/05_building_blocks-EN.png)
 
 **Level 1** is the white box description of the overall system together
 with black box descriptions of all contained building blocks.
@@ -290,6 +284,39 @@ following white box template. It contains
 
 **_<Overview Diagram>_**
 
+<iframe id="SystemContext" src="/workspace/embed?diagram=SystemContext&diagramSelector=false&iframe=SystemContext" width="50%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>
+<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>
+
+[//]: # ()
+[//]: # (<iframe id="IDE_Containers" src="/workspace/embed?diagram=IDE_Containers&diagramSelector=false&iframe=IDE_Containers" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
+[//]: # ()
+[//]: # (<iframe id="IDE_Containers_VSCode" src="/workspace/embed?diagram=IDE_Containers_VSCode&diagramSelector=false&iframe=IDE_Containers_VSCode" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
+[//]: # ()
+[//]: # (<iframe id="IDE_Containers_Generic" src="/workspace/embed?diagram=IDE_Containers_Generic&diagramSelector=false&iframe=IDE_Containers_Generic" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
+[//]: # ()
+[//]: # (<iframe id="Generic_IDE_Plugins" src="/workspace/embed?diagram=Generic_IDE_Plugins&diagramSelector=false&iframe=Generic_IDE_Plugins" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
+[//]: # ()
+[//]: # (<iframe id="NodeJS_IDE_Plugins" src="/workspace/embed?diagram=NodeJS_IDE_Plugins&diagramSelector=false&iframe=NodeJS_IDE_Plugins" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
+[//]: # ()
+[//]: # (<iframe id="Ng2React_Core" src="/workspace/embed?diagram=Ng2React_Core&diagramSelector=false&iframe=Ng2React_Core" width="100%" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowfullscreen="true"></iframe>)
+
+[//]: # (<script type="text/javascript" src="https://static.structurizr.com/js/structurizr-embed.js"></script>)
+
 Motivation
 
 : _&lt;text explanation&gt;_
@@ -635,7 +662,7 @@ A potential (but not mandatory) structure for this section could be:
 Note: it might be difficult to assign individual concepts to one
 specific topic on this list.
 
-![Possible topics for crosscutting concepts](images/08-Crosscutting-Concepts-Structure-EN.png)
+![Possible topics for crosscutting concepts](../images/08-Crosscutting-Concepts-Structure-EN.png)
 
 ## _&lt;Concept 1&gt;_
 
@@ -810,3 +837,5 @@ Potentially more columns in case you need translations.
 | ------ | -------------------- |
 | Term 1 | &lt;definition-1&gt; |
 | Term 2 | &lt;definition-2&gt; |
+
+

docs/structurizr.properties renamed to structurizr/structurizr.properties

@@ -1,5 +1,5 @@
 workspace "ng2react" "A tool that converts AngularJS components to React using OpenAI API" {
-    !docs .
+    !docs ./arc42
     model {
         openAiApi = softwareSystem "OpenAI" "Public API for generative AI" "External"