fix error and update README.md

Author: cookieID

README.md

@@ -1,24 +1,18 @@
 This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
 
-## Getting Started
+# TraceView 2
+
+TraceView 2 is a web-based visualization tool designed to enhance the capabilities of
+[ARDoCo](https://github.com/ardoco/ardoco). \
+It provides a clear, visual way to explore tracelinks and find inconsistencies between software architecture models and
+documentation in software projects.
+
+It is built using Next.js and React.
 
-First, run the development server:
 
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
 
 ## Docker
 
@@ -28,3 +22,5 @@ docker build -t traceview2 .
 docker run -p 3000:3000 traceview2
 ```
 
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+

next.config.ts

@@ -1,7 +1,8 @@
-import type { NextConfig } from "next";
+import type {NextConfig} from "next";
 
 const nextConfig : NextConfig = {
     /* config options here */
+    output: 'standalone',
     pageExtensions: ["mdx", "tsx", "ts"]
 };
 export default nextConfig;

src/app/layout.tsx

@@ -14,7 +14,7 @@ const inter = Inter({subsets: ['latin']});
 
 export const metadata: Metadata = { // those metadatas are the ones that are used for every page in the application. They can be overridden on a page by page basis.
     title: ' ArDoCo TraceView 2',
-    description: 'This is a demo project',
+    description: 'Is a web application for ARDoCo to visualize tracelinks and inconsistencies between software architecture models and documentation.',
     icons: {
         icon: '/ardoco-logo.png',
     }

src/app/view-provided/[id]/page.tsx

@@ -8,14 +8,14 @@ import {FileType} from "@/components/dataTypes/FileType";
 import {HighlightProvider} from "@/contexts/HighlightTracelinksContextType";
 import {ResultDisplay} from "@/components/traceLinksResultViewer/ResultDisplay";
 import {getTraceLinkTypeByName, TraceLinkType, TraceLinkTypes} from "@/components/dataTypes/TraceLinkTypes";
-import {ErrorDisplay} from "@/app/view/[id]/page";
 import {useNavigation} from "@/contexts/NavigationContext";
 import {InconsistencyProvider} from "@/contexts/HighlightInconsistencyContext";
 import {Inconsistency} from "@/components/traceLinksResultViewer/views/inconsistencies/dataModel/Inconsistency";
 import {
     parseInconsistenciesFromJSON
 } from "@/components/traceLinksResultViewer/views/inconsistencies/parser/InconsistencyParser";
 import {getResultViewOption} from "@/components/dataTypes/DisplayOption";
+import Button from "@/components/Button";
 
 interface TraceLinkResult {
     traceLinkType: TraceLinkType;
@@ -125,4 +125,25 @@ export default function ViewProvided() {
             </HighlightProvider>
         </>
     );
+}
+
+function ErrorDisplay({message, onRetry, retryAllowed}: {
+    message: string;
+    onRetry: (signal: AbortSignal) => void;
+    retryAllowed: boolean
+}) {
+    const {controller} = useNavigation();
+
+    return (
+        <div className="w-full bg-gray-100 text-gray-700 p-3 text-center font-semibold border-gray-300 animate-fade-in">
+            {message}
+            {retryAllowed && (
+                <Button
+                    text="Retry"
+                    onButtonClicked={() => onRetry(controller.signal)}
+                    disabled={false}
+                />
+            )}
+        </div>
+    );
 }

src/app/view/[id]/page.tsx

@@ -4,7 +4,6 @@ import {useParams, useSearchParams} from "next/navigation";
 import React, {useEffect, useMemo, useState} from "react";
 import {ResultDisplay} from "@/components/traceLinksResultViewer/ResultDisplay";
 import {getTraceLinkTypeByName, TraceLinkTypes} from "@/components/dataTypes/TraceLinkTypes";
-import Button from "@/components/Button";
 import {HighlightProvider} from "@/contexts/HighlightTracelinksContextType";
 import {parseTraceLinksFromJSON} from "@/components/traceLinksResultViewer/views/tracelinks/parser/TraceLinkParser";
 import {TraceLink} from "@/components/traceLinksResultViewer/views/tracelinks/dataModel/TraceLink";
@@ -145,7 +144,6 @@ export default function NewUploadProject() {
     );
 }
 
-
 function LoadingBanner() {
     return (
         <div className="w-full bg-gray-100 text-gray-700 p-3 text-center font-semibold border-gray-300 animate-fade-in">
@@ -154,23 +152,3 @@ function LoadingBanner() {
     );
 }
 
-export function ErrorDisplay({message, onRetry, retryAllowed}: {
-    message: string;
-    onRetry: (signal: AbortSignal) => void;
-    retryAllowed: boolean
-}) {
-    const {controller} = useNavigation();
-
-    return (
-        <div className="w-full bg-gray-100 text-gray-700 p-3 text-center font-semibold border-gray-300 animate-fade-in">
-            {message}
-            {retryAllowed && (
-                <Button
-                    text="Retry"
-                    onButtonClicked={() => onRetry(controller.signal)}
-                    disabled={false}
-                />
-            )}
-        </div>
-    );
-}

src/components/dataTypes/MessageSource.tsx

@@ -1,6 +1,7 @@
 export enum MessageSource {
-    TRACELINK_ONLY,
-    ELEMENT_CLICK,
-    INCONSISTENCY_ONLY,
+    TRACELINK,
+    PROVIDED_PROJECT_ELEMENT,
+    /** e.g. a code element, a sentence from Documentation or an element from an architecture Element */
+    INCONSISTENCY,
     NONE
 }

src/components/inputComponents/TextInput.tsx

@@ -9,6 +9,7 @@ interface TextInputProps {
 export default function TextInput({placeholderText, value, onChange}: TextInputProps) {
     return (
         <input
+            id={"project-name"}
             type="text"
             value={value}
             onChange={onChange}

src/components/traceLinksResultViewer/SearchResultMessage.tsx

@@ -41,14 +41,15 @@ export function SearchResultMessage({displayOptions}: SearchResultMessageProps)
 
         const source =
             traceLinkTimestamp > inconsistencyTimestamp
-                ? traceLinkSource || MessageSource.ELEMENT_CLICK
+                ? traceLinkSource || MessageSource.TRACELINK
                 : inconsistencyTimestamp > traceLinkTimestamp
-                    ? inconsistencySource || MessageSource.ELEMENT_CLICK
-                    : traceLinkTimestamp > 0 ? MessageSource.ELEMENT_CLICK : MessageSource.NONE;
+                    ? inconsistencySource || MessageSource.PROVIDED_PROJECT_ELEMENT
+                    : traceLinkTimestamp > 0 ? MessageSource.PROVIDED_PROJECT_ELEMENT : MessageSource.NONE;
 
         const parts: MessagePart[] = [];
 
-        if (source === MessageSource.TRACELINK_ONLY && displayTraceLinks) {
+
+        if (source == MessageSource.TRACELINK && displayTraceLinks) {
             parts.push(
                 {
                     text: traceCount === 0 ? 'no traceLinks' :
@@ -57,7 +58,7 @@ export function SearchResultMessage({displayOptions}: SearchResultMessageProps)
                 },
                 {text: ' found.', type: 'normal'}
             );
-        } else if (source === MessageSource.INCONSISTENCY_ONLY && displayInconsistencies) {
+        } else if (source === MessageSource.INCONSISTENCY && displayInconsistencies) {
             parts.push(
                 {
                     text: inconsistencyCount === 0 ? 'no inconsistencies' :
@@ -66,7 +67,7 @@ export function SearchResultMessage({displayOptions}: SearchResultMessageProps)
                 },
                 {text: ' found.', type: 'normal'}
             );
-        } else if (source === MessageSource.ELEMENT_CLICK) {
+        } else if (source === MessageSource.PROVIDED_PROJECT_ELEMENT) {
             if (displayTraceLinks) {
                 parts.push({
                     text: traceCount === 0 ? 'no traceLinks' :

src/contexts/HighlightInconsistencyContext.tsx

@@ -75,7 +75,7 @@ export function InconsistencyProvider({
             return;
         }
         setHighlightedInconsistencies([inconsistency]);
-        setMessageSource(MessageSource.INCONSISTENCY_ONLY);
+        setMessageSource(MessageSource.INCONSISTENCY);
         setLastSearchTimestamp(Date.now());
         setLastClickedSource(inconsistency.id, DisplayOption.INCONSISTENCIES);
     }
@@ -93,7 +93,7 @@ export function InconsistencyProvider({
             setHighlightedInconsistencies([]);
             console.warn(`No inconsistency found for sentence number ${sentence}`);
         }
-        setMessageSource(MessageSource.ELEMENT_CLICK);
+        setMessageSource(MessageSource.PROVIDED_PROJECT_ELEMENT);
         setLastSearchTimestamp(Date.now());
         setLastClickedSource(sentence, DisplayOption.DOCUMENTATION);
     }
@@ -110,7 +110,7 @@ export function InconsistencyProvider({
             setHighlightedInconsistencies([]);
             console.warn(`No inconsistency found for model element ID ${modelElementId}`);
         }
-        setMessageSource(MessageSource.ELEMENT_CLICK);
+        setMessageSource(MessageSource.PROVIDED_PROJECT_ELEMENT);
         setLastSearchTimestamp(Date.now());
         setLastClickedSource(modelElementId, DisplayOption.ARCHITECTURE_MODEL);
     }

src/contexts/HighlightTracelinksContextType.tsx

@@ -74,7 +74,7 @@ export function HighlightProvider({
         }
 
         setHighlightedTraceLinks(matchingTraceLinks);
-        setMessageSource(MessageSource.ELEMENT_CLICK);
+        setMessageSource(MessageSource.PROVIDED_PROJECT_ELEMENT);
         setLastSearchTimestamp(Date.now());
         setLastClickedSource({id, type});
     };
@@ -84,7 +84,7 @@ export function HighlightProvider({
             return;
         }
         setHighlightedTraceLinks([traceLink]);
-        setMessageSource(MessageSource.TRACELINK_ONLY);
+        setMessageSource(MessageSource.TRACELINK);
         setLastSearchTimestamp(Date.now());
         setLastClickedSource({id: traceLink.id, type: DisplayOption.TRACELINKS});
     }