applying csv escape to database exports too

scope interactive output more tightly by callback

.github/dependabot.yml

@@ -0,0 +1,12 @@
+version: 2
+updates:
+  - package-ecosystem: "npm"
+    directory: "/"
+    target-branch: "Mythic-v4.0.0"
+    schedule:
+      interval: "weekly"
+  - package-ecosystem: "gomod"
+    directory: "/"
+    target-branch: "Mythic-v4.0.0"
+    schedule:
+      interval: "weekly"

.github/workflows/docker.yml

@@ -0,0 +1,571 @@
+# Pulled from Thanatos (https://github.com/MythicAgents/thanatos/blob/rewrite/.github/workflows/image.yml) - MEhrn00
+
+# Name for the Github actions workflow
+name: Build and push container images
+
+on:
+  # Only run workflow when there is a new release published in Github
+  #release:
+  #  types: [published]
+  push:
+    branches:
+      - 'Mythic-v4.0.0'
+      - 'master'
+    tags:
+      - "v*.*.*"
+
+# Variables holding configuration settings
+env:
+  # Container registry the built container image will be pushed to
+  REGISTRY: ghcr.io
+
+  # Set the container image name to the Github repository name. (its-a-feature/Mythic)
+  MYTHIC_SERVER_IMAGE_NAME: ${{ github.repository }}_server
+  MYTHIC_CLI_IMAGE_NAME: ${{ github.repository }}_cli
+  MYTHIC_POSTGRES_IMAGE_NAME: ${{ github.repository }}_postgres
+  MYTHIC_RABBITMQ_IMAGE_NAME: ${{ github.repository }}_rabbitmq
+  MYTHIC_DOCUMENTATION_IMAGE_NAME: ${{ github.repository }}_documentation
+  MYTHIC_JUPYTER_IMAGE_NAME: ${{ github.repository }}_jupyter
+  MYTHIC_GRAPHQL_IMAGE_NAME: ${{ github.repository }}_graphql
+  MYTHIC_NGINX_IMAGE_NAME: ${{ github.repository }}_nginx
+  MYTHIC_REACT_IMAGE_NAME: ${{ github.repository }}_react
+
+  # Description label for the package in Github
+  IMAGE_DESCRIPTION: "test containers for Mythic development. Do not use this version!"
+
+  # Source URL for the package in Github. This links the Github repository packages list
+  # to this container image
+  IMAGE_SOURCE: ${{ github.server_url }}/${{ github.repository }}
+
+  # License for the container image
+  IMAGE_LICENSE: BSD-3-Clause
+
+  # Set the container image version to the Github release tag
+  VERSION: ${{ github.ref_name }}
+
+  # Branch for pushing release changes
+  RELEASE_BRANCH: "Mythic-v4.0.0"
+
+jobs:
+  # Builds the base container image and pushes it to the container registry
+  mythic_server:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+      # the following are unique to this job
+      - name: Lowercase the server container image name
+        run: echo "MYTHIC_SERVER_IMAGE_NAME=${MYTHIC_SERVER_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Copy version file over
+        run: cp VERSION mythic-docker/src/VERSION
+      - name: Build and push the server container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: mythic-docker
+          file: mythic-docker/.docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_SERVER_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_SERVER_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_postgres:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+      # the following are unique to this job
+      - name: Lowercase the postgres container image name
+        run: echo "MYTHIC_POSTGRES_IMAGE_NAME=${MYTHIC_POSTGRES_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the postgres container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: postgres-docker
+          file: postgres-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_POSTGRES_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_POSTGRES_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_rabbitmq:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+      # the following are unique to this job
+      - name: Lowercase the rabbitmq container image name
+        run: echo "MYTHIC_RABBITMQ_IMAGE_NAME=${MYTHIC_RABBITMQ_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the rabbitmq container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: rabbitmq-docker
+          file: rabbitmq-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_RABBITMQ_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_RABBITMQ_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_documentation:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+      # the following are unique to this job
+      - name: Lowercase the documentation container image name
+        run: echo "MYTHIC_DOCUMENTATION_IMAGE_NAME=${MYTHIC_DOCUMENTATION_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the documentation container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: documentation-docker
+          file: documentation-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_DOCUMENTATION_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_DOCUMENTATION_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_jupyter:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+
+      # these two are unique
+
+      - name: Lowercase the jupyter container image name
+        run: echo "MYTHIC_JUPYTER_IMAGE_NAME=${MYTHIC_JUPYTER_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the jupyter container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: jupyter-docker
+          file: jupyter-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_JUPYTER_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_JUPYTER_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_graphql:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+
+      # these two are unique
+
+      - name: Lowercase the graphql container image name
+        run: echo "MYTHIC_GRAPHQL_IMAGE_NAME=${MYTHIC_GRAPHQL_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the graphql container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: hasura-docker
+          file: hasura-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_GRAPHQL_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_GRAPHQL_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_nginx:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+
+      # these two are unique
+
+      - name: Lowercase the nginx container image name
+        run: echo "MYTHIC_NGINX_IMAGE_NAME=${MYTHIC_NGINX_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the nginx container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: nginx-docker
+          file: nginx-docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_NGINX_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_NGINX_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  mythic_react:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+
+      # these two are unique
+
+      - name: Lowercase the react container image name
+        run: echo "MYTHIC_REACT_IMAGE_NAME=${MYTHIC_REACT_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Build and push the react container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: .
+          file: mythic-react-docker/.docker/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_REACT_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_REACT_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+
+  # update mythic-cli latest after we're sure all the others build properly
+  mythic_cli:
+    runs-on: ubuntu-latest
+    needs:
+      - mythic_server
+      - mythic_postgres
+      - mythic_rabbitmq
+      - mythic_documentation
+      - mythic_jupyter
+      - mythic_graphql
+      - mythic_nginx
+      - mythic_react
+    permissions:
+      contents: write
+      packages: write
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+      - name: Log in to the container registry
+        uses: docker/login-action@v4 # ref: https://github.com/marketplace/actions/docker-login
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+        with:
+          platforms: 'arm64,arm'
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v4
+      # the following are unique to this job
+      - name: Lowercase the cli container image name
+        run: echo "MYTHIC_CLI_IMAGE_NAME=${MYTHIC_CLI_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+
+      - name: Fix the mythic_docker_latest reference to reference the new release tag
+        working-directory: Mythic_CLI/src/cmd/config
+        run: |
+          sed -i "s|^const MythicDockerLatest =.*$|const MythicDockerLatest = \"${VERSION}\"|" constants.go
+
+      - name: Build and push the cli container image
+        uses: docker/build-push-action@v7 # ref: https://github.com/marketplace/actions/build-and-push-docker-images
+        with:
+          context: Mythic_CLI
+          file: Mythic_CLI/Dockerfile
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_CLI_IMAGE_NAME }}:${{ env.VERSION }}
+            ${{ env.REGISTRY }}/${{ env.MYTHIC_CLI_IMAGE_NAME }}:latest
+          push: ${{ github.ref_type == 'tag' }}
+          # These container metadata labels allow configuring the package in Github
+          # packages. The source will link the package to this Github repository
+          labels: |
+            org.opencontainers.image.source=${{ env.IMAGE_SOURCE }}
+            org.opencontainers.image.licenses=${{ env.IMAGE_LICENSE }}
+          platforms: linux/amd64,linux/arm64
+          outputs: type=image,name=target,annotation-index.org.opencontainers.image.description=${{ env.IMAGE_DESCRIPTION }}
+
+  update_files:
+    runs-on: ubuntu-latest
+    needs:
+      - mythic_server
+      - mythic_cli
+      - mythic_postgres
+      - mythic_rabbitmq
+      - mythic_documentation
+      - mythic_jupyter
+      - mythic_graphql
+      - mythic_nginx
+      - mythic_react
+    permissions:
+      contents: write
+      packages: write
+
+    steps:
+      # Pull in the repository code
+      - name: Checkout the repository
+        uses: actions/checkout@v5 # ref: https://github.com/marketplace/actions/checkout
+
+      # update names to lowercase
+      - name: Lowercase the server container image name
+        run: echo "MYTHIC_SERVER_IMAGE_NAME=${MYTHIC_SERVER_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the cli container image name
+        run: echo "MYTHIC_CLI_IMAGE_NAME=${MYTHIC_CLI_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the postgres container image name
+        run: echo "MYTHIC_POSTGRES_IMAGE_NAME=${MYTHIC_POSTGRES_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the rabbitmq container image name
+        run: echo "MYTHIC_RABBITMQ_IMAGE_NAME=${MYTHIC_RABBITMQ_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the documentation container image name
+        run: echo "MYTHIC_DOCUMENTATION_IMAGE_NAME=${MYTHIC_DOCUMENTATION_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the jupyter container image name
+        run: echo "MYTHIC_JUPYTER_IMAGE_NAME=${MYTHIC_JUPYTER_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the graphql container image name
+        run: echo "MYTHIC_GRAPHQL_IMAGE_NAME=${MYTHIC_GRAPHQL_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the nginx container image name
+        run: echo "MYTHIC_NGINX_IMAGE_NAME=${MYTHIC_NGINX_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      - name: Lowercase the react container image name
+        run: echo "MYTHIC_REACT_IMAGE_NAME=${MYTHIC_REACT_IMAGE_NAME,,}" >> ${GITHUB_ENV}
+      # The Dockerfile which Mythic uses to pull in the base container image needs to be
+      # updated to reference the newly built container image
+      - name: Fix the server Dockerfile reference to reference the new release tag
+        working-directory: mythic-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_SERVER_IMAGE_NAME}:${VERSION}|" Dockerfile
+
+      - name: Fix the cli Dockerfile reference to reference the new release tag
+        working-directory: Mythic_CLI
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_CLI_IMAGE_NAME}:${VERSION}|" Dockerfile
+
+      - name: Fix the cli Makefile reference to reference the new release tag
+        working-directory: Mythic_CLI
+        run: |
+          sed -i "s|^BUILDER_IMAGE=ghcr\.io.*$|BUILDER_IMAGE=${REGISTRY}/${MYTHIC_CLI_IMAGE_NAME}:${VERSION}|" Makefile
+
+      - name: Fix the mythic_docker_latest reference to reference the new release tag
+        working-directory: Mythic_CLI/src/cmd/config
+        run: |
+          sed -i "s|^const MythicDockerLatest =.*$|const MythicDockerLatest = \"${VERSION}\"|" constants.go
+
+      - name: Fix the postgres Dockerfile reference to reference the new release tag
+        working-directory: postgres-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_POSTGRES_IMAGE_NAME}:${VERSION}|" Dockerfile
+
+      - name: Fix the rabbitmq Dockerfile reference to reference the new release tag
+        working-directory: rabbitmq-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_RABBITMQ_IMAGE_NAME}:${VERSION}|" Dockerfile
+
+      - name: Fix the documentation Dockerfile reference to reference the new release tag
+        working-directory: documentation-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_DOCUMENTATION_IMAGE_NAME}:${VERSION}|" Dockerfile
+
+      - name: Fix the jupyter Dockerfile reference to reference the new release tag
+        working-directory: jupyter-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_JUPYTER_IMAGE_NAME}:${VERSION}|" Dockerfile
+      - name: Fix the graphql Dockerfile reference to reference the new release tag
+        working-directory: hasura-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_GRAPHQL_IMAGE_NAME}:${VERSION}|" Dockerfile
+      - name: Fix the nginx Dockerfile reference to reference the new release tag
+        working-directory: nginx-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_NGINX_IMAGE_NAME}:${VERSION}|" Dockerfile
+      - name: Fix the react Dockerfile reference to reference the new release tag
+        working-directory: mythic-react-docker
+        run: |
+          sed -i "s|^FROM ghcr\.io.*$|FROM ${REGISTRY}/${MYTHIC_REACT_IMAGE_NAME}:${VERSION}|" Dockerfile
+      # Push the changes to the Dockerfile
+      - name: Push the updated base Dockerfile image reference changes
+        if: ${{ github.ref_type == 'tag' }}
+        uses: EndBug/add-and-commit@v9 # ref: https://github.com/marketplace/actions/add-commit
+        with:
+          # Only add the Dockerfile changes. Nothing else should have been modified
+          add: "['Mythic_CLI/Makefile', 'Mythic_CLI/src/cmd/config/constants.go']"
+          # Use the Github actions bot for the commit author
+          default_author: github_actions
+          committer_email: github-actions[bot]@users.noreply.github.com
+
+          # Set the commit message
+          message: "Bump Mythic Dockerfile tag to match release '${{ env.VERSION }}'"
+
+          # Overwrite the current git tag with the new changes
+          tag: '${{ env.VERSION }} --force'
+
+          # Push the new changes with the tag overwriting the current one
+          tag_push: '--force'
+
+          # Push the commits to the branch marked as the release branch
+          push: origin HEAD:${{ env.RELEASE_BRANCH }} --set-upstream
+
+          # Have the workflow fail in case there are pathspec issues
+          pathspec_error_handling: exitImmediately

.gitignore

@@ -4,10 +4,20 @@ __pycache__/
 docs/_build/
 # Environments
 .env
+tmp
+saved_images/
 .venv
+*.swp
+mythic_server
+docker-compose.yml
+.ipynb_checkpoints/
 env/
 venv/
 ENV/
+mythic-cli
+.DS_Store
+[0-9a-zA-Z]*-[0-9a-zA-Z]*-[0-9a-zA-Z]*-[0-9a-zA-Z]*-[0-9a-zA-Z]*
+*.svg
 env.bak/
 venv.bak/
 # pycharm
@@ -15,16 +25,20 @@ venv.bak/
 # ssl certs
 ssl/
 # Mythic files
-files/
+nginx-docker/config/blockips.conf
+mythic-docker/src/Mythic
 mythic_access.*
 mythic_sync/
 postgres-docker/database/
 rabbitmq-docker/storage/
 C2_profiles/
 Payload_Types/
+InstalledServices/
 Docker_Templates/
 documentation-docker/content/
+documentation-docker/public/
 display_output.txt
+full_attack.json
 nginx-docker/config/conf.d/services.conf
 ## Ignore Visual Studio temporary files, build results, and
 ## files generated by popular Visual Studio add-ons.
@@ -149,3 +163,15 @@ _ReSharper*/
 
 # vscode
 .vscode/
+
+jupyter-docker/jupyter/MythicExamples/.ipynb_checkpoints/
+
+nginx-docker/config/blockips.conf
+/MythicReactUI/build/
+/MythicReactUI/node_modules/
+/mythic-react-docker/mythic/public/
+/.gocache/
+
+.gocache/
+MythicReactUI/build
+MythicReactUI/node_modules

Example_C2_Profile/Dockerfile

@@ -1 +0,0 @@
-FROM itsafeaturemythic/python38_sanic_c2profile:0.0.6

Example_C2_Profile/c2_code/config.json

@@ -1,18 +0,0 @@
-{
-  "instances": [
-  {
-    "ServerHeaders": {
-      "Server": "NetDNA-cache/2.2",
-      "Cache-Control": "max-age=0, no-cache",
-      "Pragma": "no-cache",
-      "Connection": "keep-alive",
-      "Content-Type": "application/javascript; charset=utf-8"
-    },
-    "port": 80,
-    "key_path": "",
-    "cert_path": "",
-    "use_ssl": false,
-    "debug": false
-    }
-  ]
-}

Example_C2_Profile/c2_code/fake.html

@@ -1,10 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Page Not Found!</title>
-</head>
-<body>
-
-</body>
-</html>

Example_C2_Profile/c2_code/server

@@ -1,157 +0,0 @@
-#!/usr/bin/env python3
-
-"""This is an example implementation of a C2 server that processes HTTP
-communications with an Agent, performs routing with the Mythic server,
-and adds the required Mythic header to the HTTP response to identify
-the C2 profile forwarding the request.
-"""
-from sanic import Sanic
-from sanic.response import html, redirect, text, raw
-from sanic.exceptions import NotFound
-import sys
-import asyncio
-import ssl
-from pathlib import Path
-import requests
-import json
-import os
-
-config = {}
-
-async def print_flush(message):
-    """Print message and flush the stdout buffer.
-    
-    Python's stdout is buffered, so it collects data written
-    into a buffer before it is written to the terminal. This
-    forces the buffer to be written to the terminal instead of
-    waiting for output to eventually occur.
-
-    Args:
-        message: self-explanatory
-    """
-    print(message)
-    sys.stdout.flush()
-
-
-def server_error_handler(request, exception):
-    """Error handler for Sanic app. Formats server error to be presented.
-    
-    Args:
-        request: object containing the HTTP request information
-        exception: object containing exception information
-
-    """
-    if request is None:
-        print("Invalid HTTP Method - Likely HTTPS trying to talk to HTTP")
-        sys.stdout.flush()
-        return html("Error: Failed to process request", status=500, headers={})
-    return html("Error: Requested URL {} not found".format(request.url), status=404, headers=config[request.app.name]['headers'])
-
-
-async def agent_message(request, **kwargs):
-    """This is the route handler that processes a request from the Agent.
-    
-    Args:
-        request: object containing the HTTP request information
-        **kwargs: any additional arguments
-    Returns:
-        HTTP response object
-    """
-    global config
-    try:
-        if config[request.app.name]['debug']:
-            await print_flush("agent_message request from: {} with {} and {}".format(request.url, request.cookies, request.headers))
-            await print_flush(" and URI: {}".format(request.query_string))
-        if config[request.app.name]['debug']:
-            await print_flush("Forwarding along to: {}".format(config['mythic_address']))
-        if request.method == "POST":
-            # manipulate the request if needed - change the "Mythic" header to match the name of your C2 profile
-            
-            #await MythicCallbackRPC().add_event_message(message="got a POST message")
-            response = requests.post(config['mythic_address'], data=request.body, verify=False, cookies=request.cookies, headers={"Mythic": "http", **request.headers})
-        else:
-            # manipulate the request if needed - change the "Mythic" header to match the name of your C2 profile
-            
-            #await MythicCallbackRPC().add_event_message(message="got a GET message")
-            #msg = await MythicCallbackRPC().encrypt_bytes(with_uuid=True, data="my message".encode(), uuid="eaf10700-cb30-402d-b101-8e35d67cdb41")
-            #await MythicCallbackRPC().add_event_message(message=msg.response)
-            response = requests.get(config['mythic_address'] + "?{}".format(request.query_string), verify=False, data=request.body, cookies=request.cookies, headers={"Mythic": "http", **request.headers})
-        return raw(response.content, headers=config[request.app.name]['headers'], status=response.status_code)
-    except Exception as e:
-        if request is None:
-            await print_flush("Invalid HTTP Method - Likely HTTPS trying to talk to HTTP")
-            return server_error_handler(request, e)
-        if config[request.app.name]['debug']:
-            await print_flush("error in agent_message: {}".format(str(e)))
-        return server_error_handler(request, e)
-
-
-
-if __name__ == "__main__":
-    sys.path.append("/Mythic/mythic")
-    from mythic_c2_container.C2ProfileBase import *
-    from mythic_c2_container.MythicCallbackRPC import *
-    config_file = open("config.json", 'rb')
-    main_config = json.loads(config_file.read().decode('utf-8'))
-    print("Opening config and starting instances...")
-    sys.stdout.flush()
-    # basic mapping of the general endpoints to the real endpoints
-    try:
-        config['mythic_address'] = os.environ['MYTHIC_ADDRESS']
-    except Exception as e:
-        print("failed to find MYTHIC_ADDRESS environment variable")
-        sys.stdout.flush()
-        sys.exit(1)
-    # now look at the specific instances to start
-    for inst in main_config['instances']:
-        config[str(inst['port'])] = {'debug': inst['debug'],
-                                     'headers': inst['ServerHeaders']}
-        if inst['debug']:
-            print("Debugging statements are enabled. This gives more context, but might be a performance hit")
-        else:
-            print("Debugging statements are disabled")
-        sys.stdout.flush()
-        # now to create an app instance to handle responses
-        app = Sanic(str(inst['port']))
-        app.config['REQUEST_MAX_SIZE'] = 1000000000
-        app.config['REQUEST_TIMEOUT'] = 600
-        app.config['RESPONSE_TIMEOUT'] = 600
-        app.add_route(agent_message, "/<uri:path>", methods=['GET','POST'])
-        app.add_route(agent_message, "/", methods=['GET','POST'])
-        app.error_handler.add(Exception, server_error_handler)
-        keyfile = Path(inst['key_path'])
-        certfile = Path(inst['cert_path'])
-        if keyfile.is_file() and certfile.is_file():
-            context = ssl.create_default_context(purpose=ssl.Purpose.CLIENT_AUTH)
-            context.load_cert_chain(inst['cert_path'], keyfile=inst['key_path'])
-            if inst['debug']:
-                server = app.create_server(host="0.0.0.0", port=inst['port'], ssl=context, debug=False, return_asyncio_server=True, access_log=True)
-            else:
-                server = app.create_server(host="0.0.0.0", port=inst['port'], ssl=context, debug=False, return_asyncio_server=True, access_log=False)
-            if inst['debug']:
-                print("using SSL for port {}".format(inst['port']))
-                sys.stdout.flush()
-        else:
-            if inst['debug']:
-                print("not using SSL for port {}".format(inst['port']))
-                sys.stdout.flush()
-            if inst['debug']:
-                server = app.create_server(host="0.0.0.0", port=inst['port'], debug=False, return_asyncio_server=True, access_log=True)
-            else:
-                server = app.create_server(host="0.0.0.0", port=inst['port'], debug=False, return_asyncio_server=True, access_log=False)
-        task = asyncio.ensure_future(server)
-
-    try:
-        loop = asyncio.get_event_loop()
-        def callback(fut):
-            try:
-                fetch_count = fut.result()
-            except:
-                print("port already in use")
-                sys.stdout.flush()
-                sys.exit()
-        task.add_done_callback(callback)
-        loop.run_forever()
-    except:
-        sys.exit()
-        loop.stop()

Example_C2_Profile/mythic/c2_functions/C2_RPC_functions.py

@@ -1,206 +0,0 @@
-"""This file provides basic examples of the C2 RPC functions.
-
-The following functions are implemented to provide an example of implementation:
-- test
-- opsec: checks C2 profile parameters to verify they meet user-specified OPSEC-safe implementations
-- config_check: check and validate supplied parameters when an payload request is generated
-- redirect_rules: generate redirect rules for a specific payload when called on-demand by operator
-
-Documentation follows Google Python Style Guide for comments:
-https://github.com/google/styleguide/blob/gh-pages/pyguide.md#38-comments-and-docstrings
-"""
-from mythic_c2_container.MythicRPC import *
-import json
-import netifaces
-
-async def test(request):
-    """Performs a test.
-    Args:
-        request: dict containing the function name, and parameters passed for the payload build.
-         {"action": func_name, "message": "the input", "task_id": task id num}
-
-    Returns:
-        A RPCResponse object containing status and response message
-    """
-    response = RPCResponse()
-    response.status = RPCStatus.Success
-    response.response = "hello"
-    resp = await MythicRPC().execute("create_event_message", message="Test message", warning=False)
-    return response
-
-async def opsec(request):
-    """Checks C2 profile parameters to verify they meet user-specified OPSEC-safe implementations.
-    
-    Args:
-        request: dict containing the function name, and parameters passed for the payload build.
-        
-        { "action": "opsec", "parameters": {"param_name": "param_value", "param_name2": "param_value2", ....} }
-
-    Returns:
-        A dict containing either a success or error status/message. For example:
-        
-        success: {"status": "success", "message": "<your success message here>" }
-        error:   {"status": "error", "error": "<your error message here>" }
-    """
-    # perform OPSEC checks against the parameters. In this example, the callback port
-    # is checked against common HTTPS ports when the callback host contains "https"
-    params = request["parameters"]
-    if "https" in params["callback_host"] and params["callback_port"] not in ["443", "8443", "7443"]:
-         return {"status": "error", "error": f"Mismatch - HTTPS specified, but port {params['callback_port']}, is not one of the standard port (443, 8443)\n"}
-
-    # if no OPSEC checks, just return the following message
-    # return {"status": "success", "message": "No OPSEC checks performed\n"}
-    # otherwise, indicate that OPSEC checks were successful
-    return {"status": "success", "message": "Basic OPSEC checks passed\n"}
-
-
-
-async def config_check(request):
-    """Check and validate supplied parameters when an payload request is generated.
-    
-    Args:
-        request: dict containing the function name, and parameters passed for the payload build.
-
-        { "action": "config_check", "parameters": {"param_name": "param_value", "param_name2": "param_value2", ....} }
-
-    Returns:
-        A dict containing either a success or error status/message. For example:
-        
-        success: {"status": "success", "message": "<your success message here>" }
-        error:   {"status": "error", "error": "<your error message here>" }
-    """
-    # Open the C2 profile's config.json and, build a list of ports, and confirm port use.
-    # This example code uses the default config.json.
-    try:
-        
-        with open("../c2_code/config.json") as f:
-            config = json.load(f)
-            possible_ports = []
-            for inst in config["instances"]:
-                possible_ports.append({"port": inst["port"], "use_ssl": inst["use_ssl"]})
-                if str(inst["port"]) == str(request["parameters"]["callback_port"]):
-                    if "https" in request["parameters"]["callback_host"] and not inst["use_ssl"]:
-                        message = f"C2 Profile container is configured to NOT use SSL on port {inst['port']}, but the callback host for the agent is using https, {request['parameters']['callback_host']}.\n\n"
-                        message += "This means there should be the following connectivity for success:\n"
-                        message += f"Agent via SSL to {request['parameters']['callback_host']} on port {inst['port']}, then redirection to C2 Profile container WITHOUT SSL on port {inst['port']}"
-                        return {"status": "error", "error": message}
-                    elif "https" not in request["parameters"]["callback_host"] and inst["use_ssl"]:
-                        message = f"C2 Profile container is configured to use SSL on port {inst['port']}, but the callback host for the agent is using http, {request['parameters']['callback_host']}.\n\n"
-                        message += "This means there should be the following connectivity for success:\n"
-                        message += f"Agent via NO SSL to {request['parameters']['callback_host']} on port {inst['port']}, then redirection to C2 Profile container WITH SSL on port {inst['port']}"
-                        return {"status": "error", "error": message}
-                    else:
-                        message = f"C2 Profile container and agent configuration match port, {inst['port']}, and SSL expectations.\n"
-                        return {"status": "success", "message": message}
-            message = f"Failed to find port, {request['parameters']['callback_port']}, in C2 Profile configuration\n"
-            message += f"This could indicate the use of a redirector, or a mismatch in expected connectivity.\n\n"
-            message += f"This means there should be the following connectivity for success:\n"
-            if "https" in request["parameters"]["callback_host"]:
-                message += f"Agent via HTTPS on port {request['parameters']['callback_port']} to {request['parameters']['callback_host']} (should be a redirector).\n"
-            else:
-                message += f"Agent via HTTP on port {request['parameters']['callback_port']} to {request['parameters']['callback_host']} (should be a redirector).\n"
-            if len(possible_ports) == 1:
-                message += f"Redirector then forwards request to C2 Profile container on port, {possible_ports[0]['port']}, {'WITH SSL' if possible_ports[0]['use_ssl'] else 'WITHOUT SSL'}"
-            else:
-                message += f"Redirector then forwards request to C2 Profile container on one of the following ports: {json.dumps(possible_ports)}\n"
-            if "https" in request["parameters"]["callback_host"]:
-                message += f"\nAlternatively, this might mean that you want to do SSL but are not using SSL within your C2 Profile container.\n"
-                message += f"To add SSL to your C2 profile:\n"
-                message += f"\t1. Go to the C2 Profile page\n"
-                message += f"\t2. Click configure for the http profile\n"
-                message += f"\t3. Change 'use_ssl' to 'true' and make sure the port is {request['parameters']['callback_port']}\n"
-                message += f"\t4. Click to stop the profile and then start it again\n"
-            return {"status": "success", "message": message}
-    except Exception as e:
-        return {"status": "error", "error": str(e)}
-
-
-
-async def redirect_rules(request):
-    """Generate redirect rules for a specific payload when called on-demand by operator.
-
-    Operationally, users invoke this function from the Payloads page in the Mythic UI with a
-    dropdown menu for the payload they're interested in. These rules can include functionality
-    such as Apache mod_rewrite rules, Nginx configurations, etc. This function simply generates
-    output that the operator must then copy and implement on a redirector.
-
-    Args:
-        request: dict containing the function name, and the same profile parameters that were
-        passed to the opsec and config_check functions.
-        
-        { "action": "redirect_rules", "parameters": {"param_name": "param_value", "param_name2": "param_value2", ....} }
-
-    Returns:
-        A dict containing either a success or error status/message. For example:
-    
-        success: {"status": "success", "message": "<your success message here>" }
-        error:   {"status": "error", "error": "<your error message here>" }
-
-    """
-    # This example generates Apache mod_rewrite rules for Mythic C2 profiles
-    # to redirect non-C2 traffic to another site.
-    output = "mod_rewrite rules generated from @AndrewChiles' project https://github.com/threatexpress/mythic2modrewrite:\n"
-    # Get User-Agent
-    errors = ""
-    ua = ''
-    uris = []
-    if "headers" in request['parameters']:
-        for header in request['parameters']["headers"]:
-            if header["key"] == "User-Agent":
-                ua = header["value"]
-    else:
-        errors += "[!] User-Agent Not Found\n"
-    # Get all profile URIs
-    if "get_uri" in request['parameters']:
-        uris.append("/" + request['parameters']["get_uri"])
-    else:
-        errors += "[!] No GET URI found\n"
-    if "post_uri" in request['parameters']:
-        uris.append("/" + request['parameters']["post_uri"])
-    else:
-        errors += "[!] No POST URI found\n"
-    # Create UA in modrewrite syntax. No regex needed in UA string matching, but () characters must be escaped
-    ua_string = ua.replace('(', '\(').replace(')', '\)')
-    # Create URI string in modrewrite syntax. "*" are needed in regex to support GET and uri-append parameters on the URI
-    uris_string = ".*|".join(uris) + ".*"
-    try:
-        interface = netifaces.gateways()['default'][netifaces.AF_INET][1]
-        address = netifaces.ifaddresses(interface)[netifaces.AF_INET][0]['addr']
-        c2_rewrite_template = """RewriteRule ^.*$ "{c2server}%{{REQUEST_URI}}" [P,L]"""
-        c2_rewrite_output = []
-        with open("../c2_code/config.json") as f:
-            config = json.load(f)
-            for inst in config["instances"]:
-                c2_rewrite_output.append(c2_rewrite_template.format(
-                    c2server=f"https://{address}:{inst['port']}" if inst["use_ssl"] else f"http://{address}:{inst['port']}"
-                ))
-    except Exception as e:
-        errors += "[!] Failed to get C2 Profile container IP address. Replace 'c2server' in HTACCESS rules with correct IP\n"
-        c2_rewrite_output = ["""RewriteRule ^.*$ "{c2server}%{{REQUEST_URI}}" [P,L]"""]
-    htaccess_template = '''
-########################################
-## .htaccess START
-RewriteEngine On
-## C2 Traffic (HTTP-GET, HTTP-POST, HTTP-STAGER URIs)
-## Logic: If a requested URI AND the User-Agent matches, proxy the connection to the Teamserver
-## Consider adding other HTTP checks to fine tune the check.  (HTTP Cookie, HTTP Referer, HTTP Query String, etc)
-## Refer to http://httpd.apache.org/docs/current/mod/mod_rewrite.html
-## Only allow GET and POST methods to pass to the C2 server
-RewriteCond %{{REQUEST_METHOD}} ^(GET|POST) [NC]
-## Profile URIs
-RewriteCond %{{REQUEST_URI}} ^({uris})$
-## Profile UserAgent
-RewriteCond %{{HTTP_USER_AGENT}} "{ua}"
-{c2servers}
-## Redirect all other traffic here
-RewriteRule ^.*$ {redirect}/? [L,R=302]
-## .htaccess END
-########################################
-    '''
-    htaccess = htaccess_template.format(uris=uris_string, ua=ua_string, c2servers="\n".join(c2_rewrite_output), redirect="redirect")
-    output += "\tReplace 'redirect' with the http(s) address of where non-matching traffic should go, ex: https://redirect.com\n"
-    output += f"\n{htaccess}"
-    if errors != "":
-        return {"status": "error", "error": errors}
-    else:
-        return {"status": "success", "message": output}

Example_C2_Profile/mythic/c2_functions/HTTP.py

@@ -1,138 +0,0 @@
-"""This file configures the C2 parameters to be used by a payload for communications.
-
-Mythic will utilize the defined class inheriting C2Profile to identify the C2 profile
-and parameters that are presented to the operator in the payload creation UI. These
-parameters are added to the payload's PayloadType (builder.py) so they can be used
-during the build process.
-"""
-from mythic_c2_container.C2ProfileBase import *
-
-class HTTP(C2Profile):
-    name = "http"
-    description = "Uses HTTP(S) connections with a simple query parameter or basic POST messages. For more configuration options use dynamicHTTP."
-    author = "@its_a_feature_"
-    is_p2p = False
-    is_server_routed = False
-    parameters = [
-        C2ProfileParameter(
-            name="callback_port",
-            description="Callback Port",
-            default_value="80",
-            verifier_regex="^[0-9]+$",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="killdate",
-            description="Kill Date",
-            parameter_type=ParameterType.Date,
-            default_value=365,
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="encrypted_exchange_check",
-            description="Perform Key Exchange",
-            choices=["T", "F"],
-            required=False,
-            parameter_type=ParameterType.ChooseOne,
-        ),
-        C2ProfileParameter(
-            name="callback_jitter",
-            description="Callback Jitter in percent",
-            default_value="23",
-            verifier_regex="^[0-9]+$",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="headers",
-            description="HTTP Headers",
-            required=False,
-            parameter_type=ParameterType.Dictionary,
-            default_value=[
-                {
-                    "name": "User-Agent",
-                    "max": 1,
-                    "default_value": "Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko",
-                    "default_show": True,
-                },
-                {
-                    "name": "Host",
-                    "max": 1,
-                    "default_value": "",
-                    "default_show": False,
-                },
-                {
-                    "name": "*",
-                    "max": -1,
-                    "default_value": "",
-                    "default_show": False
-                }
-            ]
-        ),
-        C2ProfileParameter(
-            name="AESPSK",
-            description="Crypto type",
-            default_value="aes256_hmac",
-            parameter_type=ParameterType.ChooseOne,
-            choices=["aes256_hmac", "none"],
-            required=False,
-            crypto_type=True
-        ),
-        C2ProfileParameter(
-            name="callback_host",
-            description="Callback Host",
-            default_value="https://domain.com",
-            verifier_regex="^(http|https):\/\/[a-zA-Z0-9]+",
-        ),
-        C2ProfileParameter(
-            name="get_uri",
-            description="GET request URI (don't include leading /)",
-            default_value="index",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="post_uri",
-            description="POST request URI (don't include leading /)",
-            default_value="data",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="query_path_name",
-            description="Name of the query parameter for GET requests",
-            default_value="q",
-            required=False,
-            verifier_regex="^[^\/]",
-        ),
-        C2ProfileParameter(
-            name="proxy_host",
-            description="Proxy Host",
-            default_value="",
-            required=False,
-            verifier_regex="^$|^(http|https):\/\/[a-zA-Z0-9]+",
-        ),
-        C2ProfileParameter(
-            name="proxy_port",
-            description="Proxy Port",
-            default_value="",
-            verifier_regex="^$|^[0-9]+$",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="proxy_user",
-            description="Proxy Username",
-            default_value="",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="proxy_pass",
-            description="Proxy Password",
-            default_value="",
-            required=False,
-        ),
-        C2ProfileParameter(
-            name="callback_interval",
-            description="Callback Interval in seconds",
-            default_value="10",
-            verifier_regex="^[0-9]+$",
-            required=False,
-        ),
-    ]

Example_C2_Profile/mythic/c2_service.sh

@@ -1,7 +0,0 @@
-#!/bin/bash
-
-cd /Mythic/mythic
-
-export PYTHONPATH=/Mythic:/Mythic/mythic
-
-python3.8 mythic_service.py

Example_C2_Profile/mythic/mythic_service.py

@@ -1,3 +0,0 @@
-#!/usr/bin/env python3
-from mythic_c2_container import mythic_service
-mythic_service.start_service_and_heartbeat(debug=False)

Example_C2_Profile/mythic/rabbitmq_config.json

@@ -1,8 +0,0 @@
-{
-  "username": "mythic_user",
-  "password": "mythic_password",
-  "virtual_host": "mythic_vhost",
-  "host": "127.0.0.1",
-  "name": "hostname",
-  "container_files_path": "/Mythic/"
-}

Example_Payload_Type/Dockerfile

@@ -1 +0,0 @@
-FROM itsafeaturemythic/python38_payload:0.1.1

Example_Payload_Type/mythic/agent_functions/builder.py

@@ -1,34 +0,0 @@
-from mythic_payloadtype_container.PayloadBuilder import *
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-import sys
-import json
-
-#define your payload type class here, it must extend the PayloadType class though
-class MyAgent(PayloadType):
-
-    name = "my_agent"  # name that would show up in the UI
-    file_extension = "exe"  # default file extension to use when creating payloads
-    author = "@YourHandleHere"  # author of the payload type
-    supported_os = [  # supported OS and architecture combos
-        SupportedOS.Windows, SupportedOS.Linux # update this list with all the OSes your agent supports
-    ]
-    wrapper = False  # does this payload type act as a wrapper for another payloads inside of it?
-    # if the payload supports any wrapper payloads, list those here
-    wrapped_payloads = [] # ex: "service_wrapper"
-    note = "Any note you want to show up about your payload type in the UI"
-    supports_dynamic_loading = False  # setting this to True allows users to only select a subset of commands when generating a payload
-    build_parameters = [
-        #  these are all the build parameters that will be presented to the user when creating your payload
-        # we'll leave this blank for now
-    ]
-    #  the names of the c2 profiles that your agent supports
-    c2_profiles = ["http"]
-    translation_container = None
-    # after your class has been instantiated by the mythic_service in this docker container and all required build parameters have values
-    # then this function is called to actually build the payload
-    async def build(self) -> BuildResponse:
-        # this function gets called to create an instance of your payload
-        resp = BuildResponse(status=BuildStatus.Success)
-        resp.payload = b""
-        return resp

Example_Payload_Type/mythic/agent_functions/cat.py

@@ -1,48 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class CatArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="path",
-                type=ParameterType.String,
-                description="path to file (no quotes required)",
-                parameter_group_info=[ParameterGroupInfo()]
-            ),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply a path to a file")
-        self.add_arg("path", self.command_line)
-
-    async def parse_dictionary(self, dictionary_arguments):
-        if "path" in dictionary_arguments:
-            self.add_arg("path", dictionary_arguments["path"])
-        else:
-            raise ValueError("Missing 'path' argument")
-
-
-class CatCommand(CommandBase):
-    cmd = "cat"
-    needs_admin = False
-    help_cmd = "cat /path/to/file"
-    description = "Read the contents of a file and display it to the user. No need for quotes and relative paths are fine"
-    version = 1
-    author = "@its_a_feature_"
-    argument_class = CatArguments
-    attackmapping = ["T1005", "T1552.001"]
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="$.NSString.stringWithContentsOfFileEncodingError",
-            artifact_type="API Called",
-        )
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/download.py

@@ -1,51 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class DownloadArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = []
-
-    async def parse_arguments(self):
-        if len(self.command_line) > 0:
-            if self.command_line[0] == "{":
-                temp_json = json.loads(self.command_line)
-                if "host" in temp_json:
-                    # this means we have tasking from the file browser rather than the popup UI
-                    # the apfell agent doesn't currently have the ability to do _remote_ listings, so we ignore it
-                    self.command_line = temp_json["path"] + "/" + temp_json["file"]
-                else:
-                    raise Exception("Unsupported JSON")
-        else:
-            raise Exception("Must provide a path to download")
-
-
-class DownloadCommand(CommandBase):
-    cmd = "download"
-    needs_admin = False
-    help_cmd = "download {path to remote file}"
-    description = "Download a file from the victim machine to the Mythic server in chunks (no need for quotes in the path)."
-    version = 1
-    supported_ui_features = ["file_browser:download"]
-    author = "@its_a_feature_"
-    parameters = []
-    attackmapping = ["T1020", "T1030", "T1041"]
-    argument_class = DownloadArguments
-    browser_script = [BrowserScript(script_name="download", author="@its_a_feature_"),
-                      BrowserScript(script_name="download_new", author="@its_a_feature_", for_new_ui=True)]
-    attributes = CommandAttributes(
-        suggested_command=True
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="$.NSFileHandle.fileHandleForReadingAtPath, readDataOfLength",
-            artifact_type="API Called",
-        )
-        task.display_params = task.args.command_line
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/exit.py

@@ -1,37 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class ExitArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = []
-
-    async def parse_arguments(self):
-        pass
-
-
-class ExitCommand(CommandBase):
-    cmd = "exit"
-    needs_admin = False
-    help_cmd = "exit"
-    description = "This exits the current apfell agent by leveraging the ObjectiveC bridge's NSApplication terminate function."
-    version = 1
-    supported_ui_features = ["callback_table:exit"]
-    author = "@its_a_feature_"
-    attackmapping = []
-    argument_class = ExitArguments
-    attributes = CommandAttributes(
-        builtin=True
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="$.NSApplication.sharedApplication.terminate",
-            artifact_type="API Called",
-        )
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/jsimport.py

@@ -1,62 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class JsimportArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="file",
-                type=ParameterType.File,
-                description="Select a JXA file to upload",
-                parameter_group_info=[ParameterGroupInfo()]
-            )
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) > 0:
-            if self.command_line[0] == "{":
-                self.load_args_from_json_string(self.command_line)
-            else:
-                raise ValueError("Missing JSON arguments")
-        else:
-            raise ValueError("Missing arguments")
-        pass
-
-    async def parse_dictionary(self, dictionary_arguments):
-        if "file" in dictionary_arguments:
-            self.add_arg("file", dictionary_arguments["file"])
-        else:
-            raise ValueError("Missing 'file' argument")
-
-
-class JsimportCommand(CommandBase):
-    cmd = "jsimport"
-    needs_admin = False
-    help_cmd = "jsimport"
-    description = "import a JXA file into memory"
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1020", "T1030", "T1041", "T1620", "T1105"]
-    argument_class = JsimportArguments
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        file_resp = await MythicRPC().execute("get_file",
-                                              file_id=task.args.get_arg("file"),
-                                              task_id=task.id,
-                                              get_contents=False)
-        if file_resp.status == MythicRPCStatus.Success:
-            original_file_name = file_resp.response[0]["filename"]
-        else:
-            raise Exception("Error from Mythic: " + str(file_resp.error))
-        task.display_params = f"{original_file_name} into memory"
-        file_resp = await MythicRPC().execute("update_file",
-                                              file_id=task.args.get_arg("file"),
-                                              delete_after_fetch=False,
-                                              comment="Uploaded into memory for jsimport")
-
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/jsimport_call.py

@@ -1,43 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-
-
-class JsimportCallArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="command",
-                type=ParameterType.String,
-                description="The command to execute within a file loaded via jsimport",
-                parameter_group_info=[ParameterGroupInfo()]
-            )
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply a path to a file")
-        self.add_arg("command", self.command_line)
-
-    async def parse_dictionary(self, dictionary_arguments):
-        if "command" in dictionary_arguments:
-            self.add_arg("command", dictionary_arguments["command"])
-        else:
-            raise ValueError("Missing 'command' argument")
-
-
-class JsimportCallCommand(CommandBase):
-    cmd = "jsimport_call"
-    needs_admin = False
-    help_cmd = "jsimport_call function_call();"
-    description = "call a function from within the JS file that was imported with 'jsimport'. This function call is appended to the end of the jsimport code and called via eval."
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1059.002"]
-    argument_class = JsimportCallArguments
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/list_entitlements.py

@@ -1,51 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class ListEntitlementsArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="pid",
-                type=ParameterType.Number,
-                default_value=-1,
-                description="Pid of the process to enumerate (-1 for all processes)",
-                parameter_group_info=[ParameterGroupInfo(
-                    required=False
-                )]
-            ),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply a path to a file")
-        self.add_arg("pid", int(self.command_line))
-
-    async def parse_dictionary(self, dictionary_arguments):
-        if "pid" in dictionary_arguments:
-            self.add_arg("pid", dictionary_arguments["pid"])
-
-
-class ListEntitlementsCommand(CommandBase):
-    cmd = "list_entitlements"
-    needs_admin = False
-    help_cmd = 'list_entitlements [pid]'
-    description = "This uses JXA to list the entitlements for a running process"
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1057"]
-    argument_class = ListEntitlementsArguments
-    supported_ui_features = ["list_entitlements:list"]
-    browser_script = [BrowserScript(script_name="list_entitlements_new", author="@its_a_feature_", for_new_ui=True)]
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        if task.args.get_arg("pid") == -1:
-            task.display_params = "for all running applications"
-        else:
-            task.display_params = "for pid " + str(task.args.get_arg("pid"))
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/load.py

@@ -1,90 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-import base64
-import sys
-
-
-class LoadArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(name="commands",
-                 type=ParameterType.ChooseMultiple,
-                 description="One or more commands to send to the agent",
-                 choices_are_all_commands=True),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply a set of commands")
-        self.add_arg("commands", self.command_line.split(" "))
-
-    async def parse_dictionary(self, dictionary_arguments):
-        if "commands" in dictionary_arguments:
-            if isinstance(dictionary_arguments["commands"], str):
-                self.add_arg("commands", dictionary_arguments["commands"].split(" "))
-            else:
-                self.add_arg("commands", dictionary_arguments["commands"])
-        else:
-            raise ValueError("Missing 'commands' argument")
-
-
-class LoadCommand(CommandBase):
-    cmd = "load"
-    needs_admin = False
-    help_cmd = "load cmd1 cmd2 cmd3..."
-    description = "This loads new functions into memory via the C2 channel."
-    version = 1
-    author = "@its_a_feature_"
-    parameters = []
-    attackmapping = ["T1030", "T1129", "T1059.002", "T1620"]
-    argument_class = LoadArguments
-    attributes = CommandAttributes(
-        suggested_command=True
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        total_code = ""
-        commands = await MythicRPC().execute("get_commands",
-                                             payload_type_name="apfell",
-                                             commands=task.args.get_arg("commands"),
-                                             os="macOS")
-        if commands.status == "success":
-            for cmd in commands.response:
-                if cmd["script_only"]:
-                    # trying to load a script only command, so just tell mythic to load it
-                    add_resp = await MythicRPC().execute("add_commands_to_callback",
-                                                         task_id=task.id,
-                                                         commands=[cmd["cmd"]])
-                    if add_resp.status != "success":
-                        await MythicRPC().execute("create_output", task_id=task.id,
-                                                  output="Failed to add command to callback: " + add_resp.error)
-                else:
-                    try:
-                        code_path = self.agent_code_path / "{}.js".format(cmd["cmd"])
-                        total_code += open(code_path, "r").read() + "\n"
-                    except Exception as e:
-                        await MythicRPC().execute("create_output",
-                                                  task_id=task.id,
-                                                  output=f"Failed to find code for {cmd['cmd']}, skipping it\n")
-            if total_code != "":
-                resp = await MythicRPC().execute("create_file", task_id=task.id,
-                    file=base64.b64encode(total_code.encode()).decode(),
-                    comment="Loading the following commands: " + task.args.command_line
-                )
-                if resp.status == MythicStatus.Success:
-                    task.args.add_arg("file_id", resp.response["agent_file_id"])
-                    task.display_params = f"the following commands: {' '.join(task.args.get_arg('commands'))}"
-                else:
-                    raise Exception("Failed to register file: " + resp.error)
-            else:
-                task.status = "completed"
-                task.display_params = f"the following commands: {' '.join(task.args.get_arg('commands'))}"
-                await MythicRPC().execute("create_output", task_id=task.id,
-                                          output="Loaded commands")
-        else:
-            raise Exception("Failed to fetch commands from Mythic: " + commands.error)
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/ls.py

@@ -1,73 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-import sys
-
-
-class LsArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="path",
-                type=ParameterType.String,
-                default_value=".",
-                description="Path of file or folder on the current system to list",
-                parameter_group_info=[ParameterGroupInfo(
-                    required=False
-                )]
-            ),
-            CommandParameter(
-                name="fetch_attributes",
-                type=ParameterType.Boolean,
-                default_value=False,
-                description="Indicate if extended attributes should be fetched for this command",
-                parameter_group_info=[ParameterGroupInfo(
-                    required=False
-                )]
-            )
-        ]
-
-    async def parse_arguments(self):
-        self.add_arg("path", self.command_line)
-
-    async def parse_dictionary(self, dictionary):
-        if "host" in dictionary:
-            # then this came from the file browser
-            self.add_arg("path", dictionary["path"] + "/" + dictionary["file"])
-            self.add_arg("file_browser", type=ParameterType.Boolean, value=True)
-        else:
-            self.load_args_from_dictionary(dictionary)
-
-
-class LsCommand(CommandBase):
-    cmd = "ls"
-    needs_admin = False
-    help_cmd = "ls /path/to/file"
-    description = "Get attributes about a file and display it to the user via API calls. No need for quotes and relative paths are fine"
-    version = 2
-    author = "@its_a_feature_"
-    attackmapping = ["T1106", "T1083"]
-    supported_ui_features = ["file_browser:list"]
-    argument_class = LsArguments
-    browser_script = [BrowserScript(script_name="ls", author="@its_a_feature_"),
-                      BrowserScript(script_name="ls_new", author="@its_a_feature_", for_new_ui=True)]
-    attributes = CommandAttributes(
-        spawn_and_injectable=True,
-        supported_os=[SupportedOS.MacOS],
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="fileManager.attributesOfItemAtPathError, fileManager.contentsOfDirectoryAtPathError",
-            artifact_type="API Called",
-        )
-        if task.args.has_arg("file_browser") and task.args.get_arg("file_browser"):
-            host = task.callback.host
-            task.display_params = host + ":" + task.args.get_arg("path")
-        else:
-            task.display_params = task.args.get_arg("path")
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/plist.py

@@ -1,53 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-import json
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class PlistArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="filename",
-                type=ParameterType.String,
-                description="full filename path of type is just read",
-                parameter_group_info=[ParameterGroupInfo(group_name="read")]
-            ),
-            CommandParameter(
-                name="type",
-                type=ParameterType.ChooseOne,
-                choices=["readLaunchAgents", "readLaunchDaemons"],
-                description="read all launchagents/launchdaemons",
-                default_value="readLaunchAgents",
-                parameter_group_info=[ParameterGroupInfo()]
-            ),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply arguments")
-        raise ValueError("Must supply named arguments or use the modal")
-
-    async def parse_dictionary(self, dictionary_arguments):
-        self.load_args_from_dictionary(dictionary_arguments)
-
-
-class PlistCommand(CommandBase):
-    cmd = "plist"
-    needs_admin = False
-    help_cmd = "plist"
-    description = "Read plists and their associated attributes for attempts to privilege escalate."
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1083", "T1007"]
-    argument_class = PlistArguments
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="$.NSMutableDictionary.alloc.initWithContentsOfFile, fileManager.attributesOfItemAtPathError",
-            artifact_type="API Called",
-        )
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/shell.py

@@ -1,88 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-
-
-class ShellArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(name="command", display_name="Command", type=ParameterType.String, description="Command to run"),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply a command to run")
-        self.add_arg("command", self.command_line)
-
-    async def parse_dictionary(self, dictionary_arguments):
-        self.load_args_from_dictionary(dictionary_arguments)
-
-
-class ShellOPSEC(CommandOPSEC):
-    injection_method = ""
-    process_creation = "/bin/bash -c"
-    authentication = ""
-
-    async def opsec_pre(self, task: MythicTask):
-        # processes = await MythicRPC().execute("search_database", task_id=task.id, table="process",
-        #                                       host=task.callback.host)
-        # if processes.status == MythicStatus.Success:
-        #     if len(processes.response) == 0:
-        #         task.opsec_pre_blocked = True
-        #         task.opsec_pre_message = f"This spawns {self.process_creation} and there is no process data on the host yet."
-        #         task.opsec_pre_message += "\nRun \"list_apps\" first to check for dangerous processes"
-        #         task.opsec_pre_bypass_role = "operator"
-        #         return
-        #     else:
-        #         processes = await MythicRPC().execute("search_database", task_id=task.id, table="process",
-        #                                               name="Microsoft Defender", host=task.callback.host)
-        #         if len(processes.response) > 0:
-        #             task.opsec_pre_blocked = True
-        #             task.opsec_pre_message = f"Microsoft Defender spotted on the host in running processes. Don't spawn commands this way"
-        # else:
-        #     task.opsec_pre_blocked = True
-        #     task.opsec_pre_message = f"Failed to query processes from Mythic:\n{processes}"
-        pass
-
-    async def opsec_post(self, task: MythicTask):
-        # processes = await MythicRPC().execute("search_database", task_id=task.id,
-        #     table="process", name="Microsoft Defender", host=task.callback.host)
-        # if processes.status == MythicStatus.Success:
-        #     if len(processes.response) > 0:
-        #         task.opsec_post_blocked = True
-        #         task.opsec_post_message = f"Microsoft Defender spotted on the host in running processes. Really, don't do this"
-        # else:
-        #     task.opsec_post_blocked = True
-        #     task.opsec_post_message = f"Failed to query processes from Mythic:\n{processes}"
-        pass
-
-
-class ShellCommand(CommandBase):
-    cmd = "shell"
-    needs_admin = False
-    help_cmd = "shell {command}"
-    description = """This runs {command} in a terminal by leveraging JXA's Application.doShellScript({command}).
-WARNING! THIS IS SINGLE THREADED, IF YOUR COMMAND HANGS, THE AGENT HANGS!"""
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1059", "T1059.004"]
-    argument_class = ShellArguments
-    opsec_class = ShellOPSEC
-    attributes = CommandAttributes(
-        suggested_command=True
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="/bin/sh -c {}".format(task.args.get_arg("command")),
-            artifact_type="Process Create",
-        )
-        resp = await MythicRPC().execute("create_artifact", task_id=task.id,
-            artifact="{}".format(task.args.get_arg("command")),
-            artifact_type="Process Create",
-        )
-        task.display_params = task.args.get_arg("command")
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/agent_functions/sleep.py

@@ -1,70 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-import sys
-
-
-def positiveTime(val):
-    if val < 0:
-        raise ValueError("Value must be positive")
-
-
-class SleepArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="jitter",
-                type=ParameterType.Number,
-                validation_func=positiveTime,
-                description="Percentage of C2's interval to use as jitter",
-                parameter_group_info=[ParameterGroupInfo(
-                    required=False,
-                    ui_position=2
-                )]
-            ),
-            CommandParameter(
-                name="interval",
-                type=ParameterType.Number,
-                validation_func=positiveTime,
-                description="Number of seconds between checkins",
-                parameter_group_info=[ParameterGroupInfo(
-                    required=False,
-                    ui_position=1
-                )]
-            ),
-        ]
-
-    async def parse_arguments(self):
-        if self.command_line[0] != "{":
-            pieces = self.command_line.split(" ")
-            if len(pieces) == 1:
-                self.add_arg("interval", pieces[0])
-                self.remove_arg("jitter")
-            elif len(pieces) == 2:
-                self.add_arg("interval", pieces[0])
-                self.add_arg("jitter", pieces[1])
-            else:
-                raise Exception("Wrong number of parameters, should be 1 or 2")
-        else:
-            self.load_args_from_json_string(self.command_line)
-
-
-class SleepCommand(CommandBase):
-    cmd = "sleep"
-    needs_admin = False
-    help_cmd = "sleep [interval] [jitter]"
-    description = "Modify the time between callbacks in seconds."
-    version = 1
-    author = "@its_a_feature_"
-    attackmapping = ["T1029"]
-    argument_class = SleepArguments
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        task.display_params = str(task.args.get_arg("interval")) + "s"
-        if task.args.get_arg("jitter") is not None:
-            task.display_params += " with " + str(task.args.get_arg("jitter")) + "% jitter"
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        resp = await MythicRPC().execute("update_callback", task_id=response.task.id, sleep_info=response.response)
-

Example_Payload_Type/mythic/agent_functions/upload.py

@@ -1,135 +0,0 @@
-from mythic_payloadtype_container.MythicCommandBase import *
-from mythic_payloadtype_container.MythicRPC import *
-import sys
-
-class UploadArguments(TaskArguments):
-    def __init__(self, command_line, **kwargs):
-        super().__init__(command_line, **kwargs)
-        self.args = [
-            CommandParameter(
-                name="file", cli_name="new-file", display_name="File to upload", type=ParameterType.File, description="Select new file to upload",
-                parameter_group_info=[
-                    ParameterGroupInfo(
-                        required=True,
-                        group_name="Default",
-                        ui_position=0
-                    )
-                ]
-            ),
-            CommandParameter(
-                name="filename", cli_name="registered-filename", display_name="Filename within Mythic", description="Supply existing filename in Mythic to upload",
-                type=ParameterType.ChooseOne,
-                dynamic_query_function=self.get_files,
-                parameter_group_info=[
-                    ParameterGroupInfo(
-                        required=True,
-                        ui_position=0,
-                        group_name="specify already uploaded file by name"
-                    )
-                ]
-            ),
-            CommandParameter(
-                name="remote_path",
-                cli_name="remote_path",
-                display_name="Upload path (with filename)",
-                type=ParameterType.String,
-                description="Provide the path where the file will go (include new filename as well)",
-                parameter_group_info=[
-                    ParameterGroupInfo(
-                        required=True,
-                        group_name="Default",
-                        ui_position=1
-                    ),
-                    ParameterGroupInfo(
-                        required=True,
-                        group_name="specify already uploaded file by name",
-                        ui_position=1
-                    )
-                ]
-            ),
-        ]
-
-    async def parse_arguments(self):
-        if len(self.command_line) == 0:
-            raise ValueError("Must supply arguments")
-        raise ValueError("Must supply named arguments or use the modal")
-
-    async def parse_dictionary(self, dictionary_arguments):
-        self.load_args_from_dictionary(dictionary_arguments)
-
-    async def get_files(self, callback: dict) -> [str]:
-        file_resp = await MythicRPC().execute("get_file", callback_id=callback["id"],
-                                              limit_by_callback=False,
-                                              get_contents=False,
-                                              filename="",
-                                              max_results=-1)
-        if file_resp.status == MythicRPCStatus.Success:
-            file_names = []
-            for f in file_resp.response:
-                # await MythicRPC().execute("get_file_contents", agent_file_id=f["agent_file_id"])
-                if f["filename"] not in file_names:
-                    file_names.append(f["filename"])
-            return file_names
-        else:
-            await MythicRPC().execute("create_event_message", warning=True,
-                                      message=f"Failed to get files: {file_resp.error}")
-            return []
-
-
-class UploadCommand(CommandBase):
-    cmd = "upload"
-    needs_admin = False
-    help_cmd = "upload"
-    description = (
-        "Upload a file to the target machine by selecting a file from your computer. "
-    )
-    version = 1
-    supported_ui_features = ["file_browser:upload"]
-    author = "@its_a_feature_"
-    attackmapping = ["T1020", "T1030", "T1041", "T1105"]
-    argument_class = UploadArguments
-    attributes = CommandAttributes(
-        suggested_command=True
-    )
-
-    async def create_tasking(self, task: MythicTask) -> MythicTask:
-        try:
-            groupName = task.args.get_parameter_group_name()
-            if groupName == "Default":
-                file_resp = await MythicRPC().execute("get_file",
-                                                    file_id=task.args.get_arg("file"),
-                                                    task_id=task.id,
-                                                    get_contents=False)
-                if file_resp.status == MythicRPCStatus.Success:
-                    if len(file_resp.response) > 0:
-                        original_file_name = file_resp.response[0]["filename"]
-                        if len(task.args.get_arg("remote_path")) == 0:
-                            task.args.add_arg("remote_path", original_file_name)
-                        elif task.args.get_arg("remote_path")[-1] == "/":
-                            task.args.add_arg("remote_path", task.args.get_arg("remote_path") + original_file_name)
-                        task.display_params = f"{original_file_name} to {task.args.get_arg('remote_path')}"
-                    else:
-                        raise Exception("Failed to find that file")
-                else:
-                    raise Exception("Error from Mythic trying to get file: " + str(file_resp.error))
-            elif groupName == "specify already uploaded file by name":
-                # we're trying to find an already existing file and use that
-                file_resp = await MythicRPC().execute("get_file", task_id=task.id,
-                                                      filename=task.args.get_arg("filename"),
-                                                      limit_by_callback=False,
-                                                      get_contents=False)
-                if file_resp.status == MythicRPCStatus.Success:
-                    if len(file_resp.response) > 0:
-                        task.args.add_arg("file", file_resp.response[0]["agent_file_id"])
-                        task.args.remove_arg("filename")
-                        task.display_params = f"existing {file_resp.response[0]['filename']} to {task.args.get_arg('remote_path')}"
-                    elif len(file_resp.response) == 0:
-                        raise Exception("Failed to find the named file. Have you uploaded it before? Did it get deleted?")
-                else:
-                    raise Exception("Error from Mythic trying to search files:\n" + str(file_resp.error))
-        except Exception as e:
-            raise Exception("Error from Mythic: " + str(sys.exc_info()[-1].tb_lineno) + " : " + str(e))
-        return task
-
-    async def process_response(self, response: AgentResponse):
-        pass

Example_Payload_Type/mythic/browser_scripts/clipboard_new.js

@@ -1,109 +0,0 @@
-function(task, responses){
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed){
-        if(responses.length > 0){
-            if(responses[0] === "Successfully set the clipboard"){
-                return {"plaintext": responses[0]};
-            }else{
-                try{
-                    let data = JSON.parse(responses[0]);
-                    let output_table = [];
-                    let all_keys = [];
-                    for(const [k,v] of Object.entries(data)){
-                        all_keys.push(k);
-                        if(k === "public.utf8-plain-text"){
-                            output_table.push({
-                                "key":{"plaintext": k},
-                                "value": {"plaintext": atob(v), "copyIcon": v.length > 0},
-                                "fetch": {"button": {
-                                    "name": "Fetch Data",
-                                    "type": "task",
-                                    "ui_feature": "clipboard:list",
-                                    "parameters": {"read": [k]}
-                                }},
-                                "view": {"button": {
-                                    "name": v=== "" ? "Empty": "View",
-                                    "type": "dictionary",
-                                    "value": {[k]:atob(v)},
-                                    "disabled": v === "",
-                                    "leftColumnTitle": "Key",
-                                    "rightColumnTitle": "Values",
-                                    "title": "Viewing " + k
-                                }}
-                            })
-                        }else{
-                            output_table.push({
-                                "key":{"plaintext": k},
-                                "value": {"plaintext": v, "copyIcon": v.length > 0},
-                                "fetch": {"button": {
-                                    "name": "Fetch Data",
-                                    "type": "task",
-                                    "ui_feature": "clipboard:list",
-                                    "parameters":{"read": [k]}
-                                }},
-                                "view": {"button": {
-                                    "name": v=== "" ? "Empty": "View",
-                                    "type": "dictionary",
-                                    "value": {[k]:v},
-                                    "disabled": v === "",
-                                    "leftColumnTitle": "Key",
-                                    "rightColumnTitle": "Values",
-                                    "title": "Viewing " + k
-                                }}
-                            })
-                        }
-                    }
-                    output_table.push({
-                        "key":{"plaintext": "Fetch All Clipboard Data"},
-                        "value": {"plaintext": ""},
-                        "fetch": {"button": {
-                            "name": "Fetch All Data",
-                            "type": "task",
-                            "ui_feature": "clipboard:list",
-                            "parameters": {"read": ["*"]}
-                        }},
-                        "view": {"button": {
-                            "name": "View",
-                            "type": "dictionary",
-                            "value": {},
-                            "disabled": true,
-                            "leftColumnTitle": "Key",
-                            "rightColumnTitle": "Values",
-                            "title": "Viewing "
-                        }}
-                    })
-                    return {
-                        "table": [
-                            {
-                                "headers": [
-                                    {"plaintext": "fetch", "type": "button", "width": 150, "disableSort": true},
-                                    {"plaintext": "view", "type": "button", "width": 100, "disableSort": true},
-                                    {"plaintext": "key", "type": "string", "fillWidth": true},
-                                    {"plaintext": "value", "type": "string", "fillWidth": true},
-
-
-                                ],
-                                "rows": output_table,
-                                "title": "Clipboard Data"
-                            }
-                        ]
-                    }
-                }catch(error){
-                    console.log(error);
-                    const combined = responses.reduce( (prev, cur) => {
-                        return prev + cur;
-                    }, "");
-                    return {'plaintext': combined};
-                }
-            }
-        }else{
-            return {"plaintext": "No output from command"};
-        }
-    }else{
-        return {"plaintext": "No data to display..."};
-    }
-}

Example_Payload_Type/mythic/browser_scripts/download_new.js

@@ -1,33 +0,0 @@
-function(task, responses){
-    console.log(task)
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed){
-        try{
-            let data = JSON.parse(responses[0]);
-            return {"download":[{
-                "agent_file_id": data["agent_file_id"],
-                "variant": "contained",
-                "name": "Download file"
-            }]};
-        }catch(error){
-            const combined = responses.reduce( (prev, cur) => {
-                return prev + cur;
-            }, "");
-            return {'plaintext': combined};
-        }
-
-    }else if(task.status === "processed"){
-        if(responses.length > 0){
-            const task_data = JSON.parse(responses[0]);
-            return {"plaintext": "Downloading file with " + task_data["total_chunks"] + " total chunks..."};
-        }
-        return {"plaintext": "No data yet..."}
-    }else{
-        // this means we shouldn't have any output
-        return {"plaintext": "No response yet from agent..."}
-    }
-}

Example_Payload_Type/mythic/browser_scripts/list_apps_new.js

@@ -1,72 +0,0 @@
-function(task, responses){
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed){
-        if(responses.length > 0){
-            try{
-                    let data = JSON.parse(responses[0]);
-                    let output_table = [];
-                    for(let i = 0; i < data.length; i++){
-                        output_table.push({
-                            "name":{"plaintext": data[i]["name"]},
-                            "pid": {"plaintext": data[i]["process_id"]},
-                            "bundle": {"plaintext": data[i]["bundle"], "copyIcon": true},
-                            "arch": {"plaintext": data[i]["architecture"]},
-                            "rowStyle": {"backgroundColor": data[i]["frontMost"] ? "mediumpurple": ""},
-                            "actions": {"button": {
-                                "name": "Actions",
-                                "type": "menu",
-                                "value": [
-                                    {
-                                        "name": "View Paths",
-                                        "type": "dictionary",
-                                        "value": {
-                                            "bundleURL": data[i]["bundleURL"],
-                                            "bin_path": data[i]["bin_path"],
-                                        },
-                                        "leftColumnTitle": "Key",
-                                        "rightColumnTitle": "Value",
-                                        "title": "Viewing Paths"
-                                    },
-                                    {
-                                      "name": "entitlements",
-                                      "type": "task",
-                                      "ui_feature": "list_entitlements:list",
-                                      "parameters": data[i]["process_id"].toString()
-                                    }
-                                ]
-                            }},
-                        })
-                    }
-                    return {
-                        "table": [
-                            {
-                                "headers": [
-                                    {"plaintext": "pid", "type": "number", "width": 100},
-                                    {"plaintext": "name", "type": "string", "fillWidth": true},
-                                    {"plaintext": "bundle", "type": "string", "fillWidth": true},
-                                    {"plaintext": "arch", "type": "string", "width": 100},
-                                    {"plaintext": "actions", "type": "button", "width": 100},
-                                ],
-                                "rows": output_table,
-                                "title": "Process Data"
-                            }
-                        ]
-                    }
-            }catch(error){
-                    console.log(error);
-                    const combined = responses.reduce( (prev, cur) => {
-                        return prev + cur;
-                    }, "");
-                    return {'plaintext': combined};
-            }
-        }else{
-            return {"plaintext": "No output from command"};
-        }
-    }else{
-        return {"plaintext": "No data to display..."};
-    }
-}

Example_Payload_Type/mythic/browser_scripts/list_entitlements_new.js

@@ -1,61 +0,0 @@
-function(task, responses){
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed){
-        if(responses.length > 0){
-
-            let headers = [
-            {"plaintext": "pid", "type": "number", "width": 100},
-            {"plaintext": "name", "type": "string", "fillWidth": true},
-            {"plaintext": "bundle", "type": "string", "fillWidth": true},
-            {"plaintext": "entitlements", "type": "button", "width": 200}];
-            let data = "";
-            try{
-                data = JSON.parse(responses[0]);
-            }catch(error){
-               const combined = responses.reduce( (prev, cur) => {
-                    return prev + cur;
-                }, "");
-                return {'plaintext': combined};
-            }
-            let rows = [];
-            for(let i = 0; i < data.length; i++){
-                let row = {
-                    "name": {"plaintext": data[i]["name"]},
-                    "pid": {"plaintext": data[i]["pid"]},
-                    "bundle": {"plaintext": data[i]["bundle"], "copyIcon": true},
-                    "entitlements": {"button": {
-                        "name": "",
-                        "startIcon": "list",
-                        "type": "dictionary",
-                        "value": data[i]["entitlements"],
-                        "disabled": Object.keys(data[i]["entitlements"]).length === 0,
-                        "leftColumnTitle": "Entitlements",
-                        "rightColumnTitle": "Value",
-                        "title": "Viewing Entitlements"
-                    }},
-                };
-                rows.push(row);
-            }
-            return {"table":[{
-                "headers": headers,
-                "rows": rows,
-                "title": "Process Entitlements"
-            }]};
-        }else{
-            const combined = responses.reduce( (prev, cur) => {
-                return prev + cur;
-            }, "");
-            return {'plaintext': combined};
-        }
-    }else if(task.status === "processed"){
-        // this means we're still downloading
-        return {"plaintext": "Only have partial data so far..."}
-    }else{
-        // this means we shouldn't have any output
-        return {"plaintext": "Not response yet from agent..."}
-    }
-}

Example_Payload_Type/mythic/browser_scripts/ls_new.js

@@ -1,143 +0,0 @@
-function(task, responses){
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed && responses.length > 0){
-        let data = "";
-        try{
-            data = JSON.parse(responses[0]);
-        }catch(error){
-           const combined = responses.reduce( (prev, cur) => {
-                return prev + cur;
-            }, "");
-            return {'plaintext': combined};
-        }
-        let ls_path = "";
-        if(data["parent_path"] === "/"){
-            ls_path = data["parent_path"] + data["name"];
-        }else{
-            ls_path = data["parent_path"] + "/" + data["name"];
-        }
-        let headers = [
-            {"plaintext": "actions", "type": "button", "width": 100, "disableSort": true},
-            {"plaintext": "size", "type": "size", "width": 200},
-            {"plaintext": "name", "type": "string", "fillWidth": true},
-            {"plaintext": "owner", "type": "string", "width": 300},
-            {"plaintext": "group", "type": "string", "width": 300},
-            {"plaintext": "posix", "type": "string", "width": 100, "disableSort": true},
-
-        ];
-        let rows = [{
-            "rowStyle":{},
-            "name": {"plaintext": data["name"], "startIcon": data["is_file"] ? "file": "folder"},
-            "size": {"plaintext": data["size"]},
-            "owner": {"plaintext": data["permissions"]["owner"]},
-            "group": {"plaintext": data["permissions"]["group"]},
-            "posix": {"plaintext": data["permissions"]["posix"]},
-            "actions": {"button": {
-                "name": "Actions",
-                "type": "menu",
-                "value": [
-                        {
-                            "name": "View XATTRs",
-                            "type": "dictionary",
-                            "value": data["permissions"],
-                            "leftColumnTitle": "XATTR",
-                            "rightColumnTitle": "Values",
-                            "title": "Viewing XATTRs"
-                        },
-                        {
-                            "name": "Get Code Signatures",
-                            "type": "task",
-                            "ui_feature": "code_signatures:list",
-                            "parameters": {"path": ls_path},
-                        },
-                        {
-                            "name": "LS Path",
-                            "type": "task",
-                            "ui_feature": "file_browser:list",
-                            "parameters": ls_path
-                        },
-                        {
-                            "name": "Download File",
-                            "type": "task",
-                            "disabled": !data["is_file"],
-                            "ui_feature": "file_browser:download",
-                            "parameters": ls_path,
-                            "startIcon": "download"
-                        }
-                    ]
-                }}
-        }];
-        for(let i = 0; i < data["files"].length; i++){
-            let ls_path = "";
-            if(data["parent_path"] === "/"){
-                ls_path = data["parent_path"] + data["name"] + "/" + data["files"][i]["name"];
-            }else{
-                ls_path = data["parent_path"] + "/" + data["name"] + "/" + data["files"][i]["name"];
-            }
-            let row = {
-                "rowStyle": {},
-                "name": {"plaintext": data["files"][i]["name"], "startIcon": data["files"][i]["is_file"] ? "file": "folder"},
-                "size": {"plaintext": data["files"][i]["size"]},
-                "owner": {"plaintext": data["files"][i]["permissions"]["owner"]},
-                "group": {"plaintext": data["files"][i]["permissions"]["group"]},
-                "posix": {"plaintext": data["files"][i]["permissions"]["posix"],
-                    "cellStyle": {
-
-                    }
-                },
-                "actions": {"button": {
-                "name": "Actions",
-                "type": "menu",
-                "value": [
-                        {
-                            "name": "View XATTRs",
-                            "type": "dictionary",
-                            "value": data["files"][i]["permissions"],
-                            "leftColumnTitle": "XATTR",
-                            "rightColumnTitle": "Values",
-                            "title": "Viewing XATTRs"
-                        },
-                        {
-                            "name": "Get Code Signatures",
-                            "type": "task",
-                            "ui_feature": "code_signatures:list",
-                            "parameters": ls_path
-                        },
-                        {
-                            "name": "LS Path",
-                            "type": "task",
-                            "ui_feature": "file_browser:list",
-                            "parameters": ls_path
-                        },
-                        {
-                            "name": "Download File",
-                            "type": "task",
-                            "disabled": !data["files"][i]["is_file"],
-                            "ui_feature": "file_browser:download",
-                            "parameters": ls_path,
-                            "startIcon": "download",
-                            "startIconColor": "lightgreen",
-                            "hoverText": "Task agent to download"
-                        }
-                    ]
-                }}
-            };
-            rows.push(row);
-        }
-        return {"table":[{
-            "headers": headers,
-            "rows": rows,
-            "title": "File Listing Data"
-        }]};
-    }else if(task.status === "processed"){
-        // this means we're still downloading
-        return {"plaintext": "Only have partial data so far..."}
-    }else{
-        // this means we shouldn't have any output
-        return {"plaintext": "Not response yet from agent..."}
-    }
-}

Example_Payload_Type/mythic/browser_scripts/screenshot_new.js

@@ -1,34 +0,0 @@
-function(task, responses){
-    if(task.status.includes("error")){
-        const combined = responses.reduce( (prev, cur) => {
-            return prev + cur;
-        }, "");
-        return {'plaintext': combined};
-    }else if(task.completed){
-        if(responses.length > 0){
-            let data = JSON.parse(responses[0]);
-            return {"screenshot":[{
-                "agent_file_id": [data["file_id"]],
-                "variant": "contained",
-                "name": "View Screenshot"
-            }]};
-        }else{
-            return {"plaintext": "No data to display..."}
-        }
-
-    }else if(task.status === "processed"){
-        // this means we're still downloading
-        if(responses.length > 0){
-            let data = JSON.parse(responses[0]);
-            return {"screenshot":[{
-                "agent_file_id": [data["file_id"]],
-                "variant": "contained",
-                "name": "View Partial Screenshot"
-            }]};
-        }
-        return {"plaintext": "No data yet..."}
-    }else{
-        // this means we shouldn't have any output
-        return {"plaintext": "Not response yet from agent..."}
-    }
-}

Example_Payload_Type/mythic/mythic_service.py

@@ -1,3 +0,0 @@
-#!/usr/bin/env python3
-from mythic_payloadtype_container import mythic_service
-mythic_service.start_service_and_heartbeat()

Example_Payload_Type/mythic/payload_service.sh

@@ -1,7 +0,0 @@
-#!/bin/bash
-
-cd /Mythic/mythic
-
-export PYTHONPATH=/Mythic:/Mythic/mythic
-
-python3.8 mythic_service.py

Example_Payload_Type/mythic/rabbitmq_config.json

@@ -1,8 +0,0 @@
-{
-  "username": "mythic_user",
-  "password": "mythic_password",
-  "virtual_host": "mythic_vhost",
-  "host": "127.0.0.1",
-  "name": "hostname",
-  "container_files_path": "/Mythic/"
-}

Example_Translator/Dockerfile

@@ -1 +0,0 @@
-FROM itsafeaturemythic/python38_translator_container:0.0.5

Example_Translator/mythic/c2_functions/C2_RPC_functions.py

@@ -1,81 +0,0 @@
-import json
-import base64
-import sys
-# translate_from_c2_format gets a message from Mythic that is in the c2-specific format
-#     and returns a message that's translated into Mythic's JSON format
-# If the associated C2Profile has `mythic_encrypts` set to False, then this function should also decrypt
-#     the message
-# request will be JSON with the following format:
-# {
-#   "enc_key": None or base64 of key if Mythic knows of one,
-#   "dec_key": None or base64 of key if Mythic knows of one,
-#   "uuid": uuid of the message,
-#   "profile": name of the c2 profile,
-#   "mythic_encrypts": True or False if Mythic thinks Mythic does the encryption or not,
-#   "type": None or a keyword for the type of encryption. currently only option besides None is "AES256"
-#   "message": base64 of the message that's currently in c2 specific format
-# }
-# This should return the JSON of the message in Mythic format
-
-
-async def translate_from_c2_format(request) -> dict:
-    if not request["mythic_encrypts"]:
-        return json.loads(base64.b64decode(request["message"]).decode()[36:])
-    else:
-        return json.loads(base64.b64decode(request["message"]))
-
-
-# translate_to_c2_format gets a message from Mythic that is in Mythic's JSON format
-#     and returns a message that's formatted into the c2-specific format
-# If the associated C2Profile has `mythic_encrypts` set to False, then this function should also encrypt
-#     the message
-# request will be JSON with the following format:
-# {
-#   "enc_key": None or base64 of key if Mythic knows of one,
-#   "dec_key": None or base64 of key if Mythic knows of one,
-#   "uuid": uuid of the message,
-#   "profile": name of the c2 profile,
-#   "mythic_encrypts": True or False if Mythic thinks Mythic does the encryption or not,
-#   "type": None or a keyword for the type of encryption. currently only option besides None is "AES256"
-#   "message": JSON of the mythic message
-# }
-# This should return the bytes of the message in c2 specific format
-
-async def translate_to_c2_format(request) -> bytes:
-    if not request["mythic_encrypts"]:
-        return base64.b64encode(request["uuid"].encode() + json.dumps(request["message"]).encode())
-    else:
-        return json.dumps(request["message"]).encode()
-
-
-# generate_keys gets a message from Mythic that is in Mythic's JSON format
-#     and returns a a JSON message with encryption and decryption keys for the specified type
-# request will be JSON with the following format:
-# { "action": "generate_keys",
-#   "message": JSON of the C2 parameter that has a crypt_type that's not None and not empty
-# }
-# example:
-# {"action":"generate_keys",
-#   "message":{
-#     "id":39,
-#     "name":"AESPSK",
-#     "default_value":"aes256_hmac\nnone",
-#     "required":false,
-#     "randomize":false,
-#     "verifier_regex":"",
-#     "parameter_type":"ChooseOne",
-#     "description":"Crypto type",
-#     "c2_profile":"http",
-#     "value":"none",
-#     "payload":"be8bd7fa-e095-4e69-87aa-a18ba73288cb",
-#     "instance_name":null,
-#     "operation":null,
-#     "callback":null}}
-# This should return the dictionary of keys like:
-# {
-#   "enc_key": "base64 of encryption key here",
-#   "dec_key": "base64 of decryption key here",
-# }
-
-async def generate_keys(request) -> dict:
-    return {"enc_key": None, "dec_key": None}

Example_Translator/mythic/c2_service.sh

@@ -1,7 +0,0 @@
-#!/bin/bash
-
-cd /Mythic/mythic
-
-export PYTHONPATH=/Mythic:/Mythic/mythic
-
-python3.8 mythic_service.py

Example_Translator/mythic/mythic_service.py

@@ -1,3 +0,0 @@
-#!/usr/bin/env python3
-from mythic_translator_container import mythic_service
-mythic_service.start_service_and_heartbeat()

Example_Translator/mythic/rabbitmq_config.json

@@ -1,8 +0,0 @@
-{
-  "username": "mythic_user",
-  "password": "mythic_password",
-  "virtual_host": "mythic_vhost",
-  "host": "127.0.0.1",
-  "name": "hostname",
-  "container_files_path": "/Mythic/"
-}

LICENSE

@@ -29,29 +29,7 @@ OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
 
-## Licenses for other projects used:
-
-## Wait For It - https://github.com/vishnubob/wait-for-it
-The MIT License (MIT)
-Copyright (c) 2016 Giles Hall
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of
-this software and associated documentation files (the "Software"), to deal in
-the Software without restriction, including without limitation the rights to
-use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
-of the Software, and to permit persons to whom the Software is furnished to do
-so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+# Licenses for other projects used:
 
 ## arrgv - https://github.com/astur/arrgv
 MIT License
@@ -75,3 +53,126 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
+
+## https://pkg.go.dev/golang.org/x/mod/semver?tab=licenses
+
+Copyright (c) 2009 The Go Authors. All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+   * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+   * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+   * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+## https://github.com/IonicaBizau/anser/blob/master/LICENSE
+
+The MIT License (MIT)
+
+Copyright (c) 2012-22 Ionică Bizău <[email protected]> (https://ionicabizau.net)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+## https://github.com/rubenv/sql-migrate/blob/master/LICENSE
+
+MIT License
+
+Copyright (C) 2014-2021 by Ruben Vermeersch <[email protected]>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+MIT license
+===========
+
+Copyright (c) 2017 sql.js authors (see AUTHORS)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+
+
+# Some portions of the Makefile taken from:
+Copyright 2017 Ryusei Yamaguchi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Makefile

@@ -0,0 +1,17 @@
+.PHONY: default
+default: linux ;
+
+linux:
+	cd Mythic_CLI && make build_linux && mv mythic-cli ../
+
+macos:
+	cd Mythic_CLI && make build_macos && mv mythic-cli ../
+
+local:
+	cd Mythic_CLI && make build_local
+
+linux_docker:
+	cd Mythic_CLI && make build_linux_docker && mv mythic-cli ../
+
+macos_docker:
+	cd Mythic_CLI && make build_macos_docker && mv mythic-cli ../

MythicReactUI/.dockerignore

@@ -0,0 +1,20 @@
+*
+!Dockerfile
+!package.json
+!package-lock.json
+!config-overrides.js
+!public/
+!public/**
+!src/
+!src/**
+!.env
+
+.DS_Store
+**/.DS_Store
+node_modules/
+build/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.npm/
+.cache/

MythicReactUI/Dockerfile

@@ -0,0 +1,17 @@
+FROM node:24-alpine
+
+WORKDIR /app
+
+COPY . .
+
+# ==== BUILD =====
+# Install dependencies (npm ci makes sure the exact versions in the lockfile gets installed)
+#RUN npm install --legacy-peer-deps
+RUN npm ci --legacy-peer-deps
+ENV CHOKIDAR_USEPOLLING=true
+ENV WATCHPACK_POLLING=true
+ENV FAST_REFRESH=true
+ENV WDS_POLLING=true
+ENV WDS_SOCKET_PATH=ws
+# ==== RUN =====
+CMD CHOKIDAR_USEPOLLING=true WATCHPACK_POLLING=true FAST_REFRESH=true WDS_POLLING=true WDS_SOCKET_PATH=ws npm run react-start

MythicReactUI/README.md

@@ -0,0 +1,15 @@
+# Getting Started with Create React App
+
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm run react-build`
+
+This builds the UI and outputs the files in the `/app/build` folder
+
+### `npm run react-start`
+
+This builds the UI and starts the internal server in development mode, so changes made to the code are reflected real-time in the UI

MythicReactUI/config-overrides.js

@@ -0,0 +1,26 @@
+const webpack = require('webpack');
+module.exports = function override(config, env) {
+    config.resolve.fallback = {
+        //url: require.resolve('url'),
+        fs: false,
+        assert: require.resolve('assert'),
+        crypto: require.resolve('crypto-browserify'),
+        path: require.resolve('path-browserify'),
+        //http: require.resolve('stream-http'),
+        //https: require.resolve('https-browserify'),
+        //os: require.resolve('os-browserify/browser'),
+        //buffer: require.resolve('buffer'),
+        stream: require.resolve('stream-browserify'),
+    };
+    /*
+    config.plugins.push(
+        new webpack.ProvidePlugin({
+            process: 'process/browser',
+            Buffer: ['buffer', 'Buffer'],
+        }),
+    );
+
+     */
+
+    return config;
+}

MythicReactUI/package.json

@@ -0,0 +1,106 @@
+{
+  "name": "mythic",
+  "version": "0.1.0",
+  "private": true,
+  "homepage": "/new",
+  "author": "@its_a_feature_",
+  "description": "React UI for Mythic C2 Framework",
+  "devDependencies": {
+    "buffer": "^6.0.3",
+    "crypto-browserify": "^3.12.1",
+    "react-app-rewired": "^2.2.1",
+    "react-scripts": "^5.0.1",
+    "stream-browserify": "^3.0.0"
+  },
+  "dependencies": {
+    "@apollo/client": "^3.13.8",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "@fortawesome/fontawesome-svg-core": "^6.5.2",
+    "@fortawesome/free-brands-svg-icons": "^6.5.2",
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
+    "@fortawesome/react-fontawesome": "^0.2.2",
+    "@hello-pangea/dnd": "^17.0.0",
+    "@mui/icons-material": "^7.0.2",
+    "@mui/lab": "^7.0.0-beta.11",
+    "@mui/material": "^7.0.2",
+    "@mui/utils": "^7.0.2",
+    "@mui/x-charts": "^8.1.0",
+    "@mui/x-date-pickers": "^8.1.0",
+    "@xterm/addon-fit": "^0.11.0",
+    "@xterm/xterm": "^6.0.0",
+    "@xyflow/react": "^12.6.0",
+    "ace-builds": "^1.40.1",
+    "anser": "^2.3.2",
+    "dayjs": "^1.11.13",
+    "dompurify": "^3.4.17",
+    "elkjs": "^0.10.0",
+    "graphql": "^16.10.0",
+    "graphql-ws": "^6.0.4",
+    "html-to-image": "^1.11.11",
+    "html2canvas": "^1.4.1",
+    "ip6": "^0.2.10",
+    "json5": "^2.2.3",
+    "jwt-decode": "^4.0.0",
+    "path-browserify": "^1.0.1",
+    "randexp": "^0.5.3",
+    "react": "^18.3.1",
+    "react-ace": "^14.0.1",
+    "react-colorful": "^5.6.1",
+    "react-dom": "^18.3.1",
+    "react-draggable": "^4.4.6",
+    "react-markdown": "^10.1.0",
+    "react-router-dom": "^7.13.1",
+    "react-scrollbar-size": "^5.0.0",
+    "react-split": "^2.0.14",
+    "react-toastify": "^11.0.5",
+    "react-tooltip": "^5.28.1",
+    "react-virtualized": "^9.22.6",
+    "react-virtualized-auto-sizer": "^1.0.26",
+    "react-window": "^1.8.11",
+    "remark-gfm": "^4.0.1",
+    "save-svg-as-png": "^1.4.17",
+    "semver": "^7.6.2",
+    "sql.js": "^1.13.0",
+    "styled-components": "^6.1.17",
+    "uuid": "^9.0.1",
+    "webpack": "^5.105.0",
+    "word-wrap": "^1.2.5"
+  },
+  "scripts": {
+    "react-start": "CHOKIDAR_USEPOLLING=true WATCHPACK_POLLING=true FAST_REFRESH=true WDS_POLLING=true BROWSER=none PORT=3000 WDS_SOCKET_PORT=7443 WDS_SOCKET_PATH=ws react-app-rewired start",
+    "react-build": "react-app-rewired build",
+    "react-test": "react-app-rewired test",
+    "react-eject": "react-scripts eject",
+    "build": "npm run react-build",
+    "start": "BROWSER=none CHOKIDAR_USEPOLLING=true WATCHPACK_POLLING=true FAST_REFRESH=true WDS_POLLING=true PORT=3000 WDS_SOCKET_PORT=7443 WDS_SOCKET_PATH=ws npm run react-start"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "babel": {
+    "presets": [
+      [
+        "react-app",
+        {
+          "runtime": "automatic"
+        }
+      ]
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

MythicReactUI/public/browser-script-worker.js

@@ -0,0 +1,61 @@
+let browserScript;
+let browserScriptSource;
+let activeRequestID;
+
+const serializeError = (error) => ({
+    name: (error && error.name) || "Error",
+    message: (error && error.message) || String(error),
+    stack: error && error.stack,
+});
+
+const postLog = (...args) => {
+    try {
+        self.postMessage({type: "log", requestID: activeRequestID, args});
+    } catch (error) {
+        self.postMessage({
+            type: "log",
+            requestID: activeRequestID,
+            args: args.map((arg) => String(arg)),
+        });
+    }
+};
+
+console.log = postLog;
+
+self.onmessage = ({data}) => {
+    if(!data || data.type !== "render"){
+        return;
+    }
+
+    const {requestID, script, task, responses} = data;
+    activeRequestID = requestID;
+    let phase = "compile";
+
+    try {
+        if(typeof script === "string" && script !== browserScriptSource){
+            browserScript = undefined;
+            browserScriptSource = undefined;
+            browserScript = Function(`"use strict";return(${script})`)();
+            if(typeof browserScript !== "function"){
+                throw new TypeError("Browser script must evaluate to a function");
+            }
+            browserScriptSource = script;
+        }
+        if(typeof browserScript !== "function"){
+            throw new Error("No browser script is loaded");
+        }
+
+        phase = "execute";
+        const result = browserScript(task, responses);
+        if(result && typeof result.then === "function"){
+            throw new TypeError("Browser scripts must return their display data synchronously");
+        }
+
+        phase = "serialize";
+        self.postMessage({type: "result", requestID, result});
+    } catch (error) {
+        self.postMessage({type: "error", requestID, phase, error: serializeError(error)});
+    } finally {
+        activeRequestID = undefined;
+    }
+};

MythicReactUI/public/index.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>Mythic</title>
+    <script>
+      (function () {
+        var resizeObserverLoopErrors = [
+          "ResizeObserver loop limit exceeded",
+          "ResizeObserver loop completed with undelivered notifications."
+        ];
+        function isResizeObserverLoopError(message) {
+          return resizeObserverLoopErrors.indexOf(message) !== -1;
+        }
+        window.addEventListener("error", function (event) {
+          if (isResizeObserverLoopError(event.message)) {
+            event.stopImmediatePropagation();
+            event.preventDefault();
+          }
+        }, true);
+        window.addEventListener("unhandledrejection", function (event) {
+          var reason = event.reason;
+          var message = reason && reason.message ? reason.message : reason;
+          if (isResizeObserverLoopError(message)) {
+            event.stopImmediatePropagation();
+            event.preventDefault();
+          }
+        }, true);
+      })();
+    </script>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

MythicReactUI/public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "Mythic",
+  "name": "Mythic C2",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

MythicReactUI/public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

MythicReactUI/src/assets/Mythic_Logo.svg

@@ -0,0 +1,164 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.7.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Isolation_Mode" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 720 720" style="enable-background:new 0 0 720 720;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#E01F2F;}
+</style>
+<g>
+	<path class="st0" d="M631.71,544.4c-2.42-0.54-7.34-1.83-13.64-4.16c0.33,0.12,0.65,0.26,0.97,0.39
+		C624.37,542.61,628.45,543.68,631.71,544.4z"/>
+	<path class="st0" d="M633.4,544.75L633.4,544.75c-0.53-0.11-1.11-0.23-1.69-0.35C632.8,544.65,633.4,544.75,633.4,544.75z"/>
+	<path class="st0" d="M141.27,535.72C123.48,559.12,99,591.36,97.89,593.2c-1.18,1.97-7.99,13.54-20.39,18.46
+		c-17.32,5.6-21.78-2.86-21.78-2.86s-20.56,0.4-19.7,17.05h34.95v-0.02h33.31c0,0,0.58-14.58,15.16-17.49l60.92-48.82
+		C156.9,555.69,146.15,544.52,141.27,535.72z"/>
+	<g>
+		<path class="st0" d="M487.03,525.19l-76.29,72.09l72.21-76.16c-0.7-0.7-1.42-1.4-2.16-2.12c-9.15-8.9-17.68-13.07-26.83-13.07
+			c-10.91,0-22.71,5.71-37.09,13.4c2.02,14.66,2.11,33.84-7.43,46.78c-0.07,0.09-0.14,0.19-0.21,0.28
+			c-10.71,14.14-19.46,25.74-20.11,26.82c-1.19,1.98-8.11,13.75-20.72,18.61c-0.46,0.18-0.9,0.3-1.33,0.44
+			c-0.51,0.18-1.04,0.33-1.58,0.49c-0.7,0.19-1.4,0.37-2.07,0.49c-0.02,0-0.02,0-0.04,0c-11.13,2.07-16.38-4.44-16.38-4.44
+			s-20.56,0.4-19.7,17.05h34.95v-0.02h33.28c0,0,0.58-14.58,15.16-17.49c0,0,0,0,0.02-0.02c0.05-0.05,0.25-0.19,0.54-0.44l0.44-0.35
+			c6.99-5.78,49.59-41.09,73.3-66.94c3-3.27,5.69-6.39,7.96-9.27c-0.25-0.25-0.49-0.51-0.74-0.76
+			C490.59,528.89,488.89,527.1,487.03,525.19z"/>
+		<path class="st0" d="M384.77,207c0,0-0.02,20.99,7.18,27.11c7.2,6.15,22.41,1.46,32.15-9.76c11.84-13.64,18.61,5.09,18.61,5.09
+			c0.37-14.56-12.78-15.8-12.78-15.8c14.72-7.18,20.65,8.89,20.65,8.89c-0.67-7.2-4.21-15.58-16.17-15.56
+			c-16.51,0.04-18.79,17.6-33.3,20.07C386.6,229.51,384.77,207,384.77,207z"/>
+		<path class="st0" d="M681.85,338.39c-2.6-12.08-7.18-23.27-13-33.56c-5.83-10.29-13.01-19.69-21.41-28.04
+			c-8.38-8.34-18.05-15.77-29.27-21.3c-11.13-5.51-23.25-8.78-35.14-10.08c-11.92-1.3-23.62-0.74-34.79,0.84
+			c-11.15,1.6-21.88,4.23-31.96,7.08c-2.55,0.72-4.85,1.35-7.64,2.23c-1.35,0.42-2.67,0.79-4.04,1.26l-4.07,1.4
+			c-5.44,1.98-11.05,4.44-16.19,7.24c-1.32,0.68-2.53,1.39-3.76,2.09c-1.25,0.7-2.37,1.39-3.53,2.07l-6.46,3.88
+			c-4.11,2.46-8.08,4.64-12.19,6.71c-4.16,2.02-8.38,4-12.78,5.81l-3.28,1.37l-3.49,1.4l-6.92,2.74
+			c-9.15,3.56-18.16,6.76-27.22,9.32c-9.04,2.58-18.12,4.51-27.2,5.64c-9.08,1.12-18.14,1.4-27.13,0.74
+			c-1.12-0.09-2.25-0.14-3.37-0.23l-3.34-0.42l-3.35-0.42c-0.53-0.05-1.18-0.18-1.79-0.26l-1.81-0.28
+			c-4.78-0.77-9.4-1.62-13.96-2.63c-9.11-2.02-17.91-4.69-25.94-8.2c-8.03-3.51-15.24-7.92-20.67-13.21
+			c-5.46-5.3-8.94-11.31-10.55-18.25c-1.6-7.01-1.3-15.05,0.76-22.79c1-3.88,2.42-7.69,4.23-11.31c1.79-3.64,3.93-7.09,6.43-10.24
+			c2.48-3.18,5.25-6.08,8.31-8.57c3.04-2.51,6.32-4.69,9.82-6.39c1.72-0.91,3.58-1.51,5.36-2.28c1.86-0.53,3.69-1.23,5.62-1.56
+			c3.81-0.86,7.76-1.32,11.82-1.26c0.02,0,0.04,0,0.05,0c2.83,0.02,5.62,0.49,8.34,1.21c1.46,0.39,2.97,0.74,4.5,1.04
+			c3.93,0.77,7.39,1.58,10.47,2.44c0.23,0.09,0.46,0.18,0.68,0.26l0.04-0.07c3,0.84,5.62,1.72,7.87,2.58v-0.11
+			c0.86,0.37,1.69,0.76,2.46,1.12c0.02,0,0.02,0,0.04,0.02c10.78,5.22,12.05,9.69,12.05,9.69c0.04,0.09,0.09,0.12,0.12,0.21
+			c2.05,2.79,3.48,5.57,4.95,7.88c5.87,8.99,8.34,11.03,8.34,11.03l1.86-3.83c-7.55-8.34-9.78-32.65-9.78-32.65
+			s15.95-3.3,23.13,0.12c6.95,3.35,0.95,16.12,0.6,16.74c5.65-2.35,11.43-13.79,11.43-13.79c4.74-2.69,3.53-11.17,3.53-11.17
+			c-18.95-22.83-44.53-26.03-65.87-22.14c-2.48,0.04-4.92,0.14-7.34,0.33c-4.5,0.33-9.01,0.4-13.5,0.11
+			c-1.18-0.07-2.35-0.12-3.53-0.16c-6.09-0.18-12.29,0.39-18.37,1.65c-3.07,0.54-6.04,1.51-9.04,2.39
+			c-2.92,1.11-5.88,2.12-8.68,3.51c-5.65,2.65-10.94,6.02-15.77,9.87c-4.85,3.85-9.2,8.24-13.03,13c-3.86,4.74-7.18,9.89-9.96,15.3
+			c-2.79,5.41-5.04,11.1-6.67,17c-3.28,11.78-4.27,24.53-1.62,37.37c1.39,6.41,3.69,12.78,6.92,18.56
+			c3.21,5.8,7.27,11.01,11.73,15.51c4.48,4.51,9.34,8.34,14.36,11.63c5.02,3.28,10.2,6.06,15.44,8.45
+			c10.47,4.78,21.13,8.1,31.77,10.62c5.3,1.26,10.64,2.32,15.86,3.23l1.93,0.33c0.65,0.11,1.23,0.23,1.97,0.32l4.18,0.6l4.2,0.58
+			c1.4,0.14,2.81,0.25,4.21,0.37c11.22,0.97,22.5,0.76,33.56-0.44c22.14-2.37,43.22-8.82,62.78-16.17l7.25-2.76l3.58-1.39l3.74-1.49
+			c4.99-1.97,9.99-4.21,14.96-6.55c4.95-2.41,9.9-5.06,14.54-7.74c4.65-2.69,8.78-5.22,12.57-7.16c3.79-1.98,7.52-3.55,11.61-4.99
+			l3.13-1.02c1.04-0.35,2.16-0.63,3.23-0.95c2.05-0.61,4.65-1.3,6.97-1.93c9.45-2.55,18.49-4.58,27.41-5.74
+			c8.9-1.12,17.61-1.39,25.83-0.39c8.22,1,15.93,3.25,22.93,6.81c6.94,3.51,13.54,8.6,19.44,14.61
+			c5.88,6.01,11.06,12.92,15.12,20.32c4.07,7.38,7.09,15.21,8.68,22.99c1.55,7.76,1.6,15.38,0.02,22.23
+			c-1.6,6.85-4.71,12.98-9.52,18.32c-4.74,5.36-11.08,9.92-18.28,13.4c-7.2,3.48-15.26,5.9-23.39,7.11
+			c-4.06,0.61-8.15,0.91-12.12,0.88c-1,0.02-1.97-0.05-2.95-0.09l-2.81-0.28c-1.91-0.07-3.65-0.51-5.44-0.81
+			c-0.91-0.11-1.74-0.4-2.6-0.65c-0.86-0.26-1.72-0.44-2.58-0.74c-1.69-0.68-3.39-1.18-5.11-2.05l-1.3-0.58l-0.65-0.3l-0.67-0.37
+			l-2.67-1.44c-0.9-0.49-1.86-1.11-2.79-1.63l-1.4-0.84l-1.49-0.95c-3.86-2.42-8.29-5.37-13.01-8.25l-3.65-2.18
+			c-1.21-0.72-2.56-1.42-3.85-2.12c-2.55-1.44-5.36-2.72-8.1-4.02c-0.68-0.33-1.39-0.63-2.11-0.91l-2.14-0.86
+			c-1.44-0.56-2.86-1.18-4.32-1.67l-4.43-1.42c-1.48-0.47-2.95-0.95-4.46-1.26l-4.48-1.07c-0.76-0.18-1.49-0.35-2.25-0.51
+			l-2.27-0.39c-3-0.56-6.04-0.9-9.06-1.25c-6.08-0.54-12.15-0.67-18.18-0.37c-1.49,0.09-2.99,0.25-4.48,0.35l-2.25,0.19l-2.21,0.3
+			l-4.43,0.6l-4.36,0.81c-11.61,2.21-22.62,5.88-32.96,10.41c-5.18,2.25-10.19,4.76-15.08,7.39c-2,1.12-4.02,2.23-6.01,3.39
+			c-36.46,10.5-75.81,5.09-107.56-16.07c-0.84-0.56-1.72-1.16-2.6-1.76c-1.09-0.09-2.04-0.25-3.14-0.35
+			c-3.74-0.49-7.38-0.65-11.06-0.65c-4.23,0-8.38,0.4-12.42,1.09l-2.9,0.51l-2.99,0.74c-0.95,0.19-1.84,0.49-2.84,0.76
+			c-0.95,0.35-1.93,0.54-2.79,0.95c-3.85,1.3-7.48,3.09-11.12,4.99c2.9-2.95,6.18-5.55,9.87-7.57c3.74-2,7.64-3.76,11.71-4.85
+			c4.11-1.14,8.39-1.84,12.57-2.09c2.9-0.16,5.69-0.16,8.62,0c-6.22-7.73-19.79-23.18-31.14-27.08c0,0-39.74-30.17-52.4-39.72
+			c-12.71-9.68-27.17-27.13-24.94-32.86c0,0,9.57-13.96,17.89-16.54c8.27-2.7,10.47-12.28,10.47-12.28s-12.28,3.49-27.57,3.93
+			s-22.23,4.39-22.23,4.39s-8.78-7.04-18.81-8.34c0,0,0.84-30.15,40.64-49.4c39.78-19.18,86.49-44.5,104.42-98.2
+			c-1.49,2.35-24.97,39.6-53.28,50.1c-29.26,10.92-66.43,23.18-78.2,30.64c-11.85,7.43-34.56,32.35-47.7,79.13l-49.31,57.72
+			c0,0,2.58,6.97,6.94,6.53c0,0,1.3,9.57,10.01,5.62c0,0,2.23,10.08,0.46,14.01c-1.76,3.95,4.43,16.16,12.66,18.35l-0.79-4.79
+			c0,0,2.16,5.23,9.57,7.43c0,0-7.83-10.06-4.85-19.69c2.56-7.92,1.53-11.77,1.05-12.91l3.79,7.67c0,0,1.28-10.47-4.04-18.68
+			c1.93,2.49,11.36,12.92,31.26,5.94c1.79-1.62,3.49-3.28,5.04-4.99l2.18-2.53c0.76-0.81,1.32-1.76,2-2.65
+			c1.39-1.7,2.49-3.58,3.83-5.43c0.6-0.95,1.16-1.93,1.7-2.95c0.6-0.95,1.19-1.93,1.9-2.88c1.11-2,2.25-3.99,3.6-6.04
+			c-0.16,2.39-0.49,4.74-0.9,7.08c-0.39,1.19-0.65,2.35-0.98,3.49l-0.65,1.69c-0.21,0.61-0.3,1.16-0.6,1.7
+			c-0.49,1.09-0.98,2.23-1.55,3.28c-0.49,1.14-1.09,2.12-1.84,3.2c-0.6,0.98-1.23,2.09-1.93,3.04l-2.35,2.83
+			c-1.69,1.84-3.58,3.6-5.57,5.15c-0.46,4.23-1.7,10.22-4.39,15.73c-0.39,0.91-0.79,1.76-1.14,2.55c1.19-1,24.15-19.55,60.08-3.06
+			l1.9,0.79l-0.98,1.84l-2.65,4.58c4.79-1.14,9.68-1.19,14.47-0.11c6.41,1.55,11.77,6.09,15.3,11.27c3.69,5.2,5.74,11.22,7.48,17
+			c0.84,2.9,1.79,5.83,3.42,8.24c1.65,2.44,4.39,4.04,7.48,4.5c-3.09-0.05-6.23-1.35-8.18-3.9c-2.05-2.49-3.2-5.43-4.34-8.24
+			c-2.2-5.72-4.39-11.41-8.1-16.03c-3.58-4.6-8.38-8.24-13.91-9.54c-5.53-1.3-11.66-0.49-16.74,1.7l-4.95,2.09l2.55-4.74l3.79-6.83
+			c-7.43-3.04-15.4-4.64-23.32-3.9c-8.62,0.76-16.95,3.99-24.43,8.57c-0.05,0.05-0.11,0.09-0.16,0.16
+			c-9.71,5.83-17.4,14.45-22.93,24.32c-6.08,10.82-13.91,25.13-19.14,35.6c-9.68,19.19-18.35,22.74-18,31.45
+			c0.46,8.73-4.34,38.88-7.78,45.03c0,0,0.79,9.68,10.87,8.71c0,0,0,7.48,10.01,6.57c0,0-6.13-9.17,2.69-13.56
+			c8.78-4.34,14.4-0.39,16.56,4.79c2.2,5.27-4.79,12.85-10.22,8.82l-2.44-3.99c0,0-6.97,11.36,6.53,14.42c0,0,1.35,7.92,15.35,7.48
+			c0,0-7.87-3.93-1.69-10.08c0,0,10.41-3.93,8.32-23.62c0,0,0.25-1.4,1.19-2.25c0.14-1.88,0.32-3.78,0.65-5.62
+			c0.6-3.99,1.33-7.88,3.23-11.82c0.86-1.93,2.05-3.99,4.25-5.57l0.65-0.46l0.54-0.35c0.3-0.25,0.65-0.46,1.04-0.79
+			c0.56-0.49,1.35-1.05,1.84-1.69c2.49-2.55,4.69-5.58,6.48-8.87c1.98-3.2,3.69-6.69,5.18-10.19c-0.3,3.9-1.28,7.64-2.6,11.38
+			c-1.28,3.74-3.04,7.38-5.62,10.66c-0.65,0.84-1.35,1.63-2.11,2.39c-0.39,0.39-0.79,0.68-1.23,1.11l-0.6,0.49l-0.35,0.25
+			l-0.19,0.16c-0.81,0.74-1.62,2.12-2.25,3.74c-1.25,3.14-2.05,6.78-2.55,10.41c-0.35,2.2-0.6,4.34-0.79,6.48
+			c0.76,0.7,1.49,1.6,2.35,2.74c7.13,9.78,0.79,25.18,23.72,36.46c-0.84-2.09-1.69-4.28-2.42-6.48c-2.3-7.08-3.85-14.56-4.23-22.02
+			c-0.26-3.79-0.21-7.57,0-11.38c0.19-3.74,0.79-7.48,1.39-11.22c0.44-1.84,0.74-3.74,1.19-5.53l0.68-2.79l0.81-2.69
+			c0.54-1.79,1.19-3.6,1.88-5.37l0.79-2.55c0.37-0.79,0.56-1.6,0.81-2.49c1.93-6.73,2.83-13.77,1.9-20.63
+			c-0.9-6.78-3.49-13.4-7.78-18.79c-0.98-1.35-2.14-2.65-3.42-3.79c-1.25-1.14-2.65-2.16-4.09-3.09c-1.46-0.9-2.99-1.6-4.64-2.14
+			c-1.55-0.51-3.2-0.79-4.9-0.84c-3.55-0.16-6.94,0.49-10.03,2.35c-1.49,0.9-2.9,2.04-4.04,3.39c-1.25,1.3-2.35,2.84-3.06,4.48
+			c0.91-3.53,3.06-6.88,6.2-9.27c2.93-2.42,6.92-3.74,10.85-3.93c1.95-0.09,3.93,0,5.9,0.46c1.93,0.46,3.88,1.11,5.62,2.09
+			c1.76,0.84,3.44,2,4.93,3.2c1.55,1.23,2.99,2.6,4.28,4.04c2.65,2.95,4.83,6.29,6.34,9.87c1.69,3.58,2.9,7.38,3.34,11.26
+			c1.14,7.78,0.39,15.66-1.95,23.04c-0.25,0.9-0.54,1.83-0.84,2.74l-0.98,2.65c-0.61,1.7-1.25,3.39-1.76,5.09
+			c-1.16,3.39-2.09,6.88-2.9,10.38c-0.65,3.49-1.39,7.02-1.74,10.62c-0.3,3.53-0.6,7.18-0.49,10.76c0,3.6,0.19,7.18,0.54,10.76
+			c0.39,3.6,1.09,7.13,1.83,10.71c0.65,2.79,1.51,5.57,2.35,8.32c0,0.05,0.05,0.05,0.05,0.05s0,0.05,0.05,0.16
+			c1.33,4.13,3.09,8.11,5.13,11.98c2.79,3.88,6.94,8.08,13.26,11.56c6.34,3.42,14.82,6.27,26.18,7.32
+			c41.97,3.93,41.06,13.12,46.77,20.55c0,0,3.93-15.26-4.79-22.74c0,0,6.08-0.46,21.39,14.86c15.3,15.31,25.41,7.88,25.41,7.88
+			s-11.45,1.3-16.6-7.88c-5.27-9.17-7.52-30.56-14.51-34.93v-1.79c-1.09-1.25-2.2-2.55-3.35-3.9c-2.55-3.14-4.83-6.43-7.13-9.87
+			c-2.12-3.39-4.23-6.92-5.83-10.85c3.49,2.39,6.53,5.2,9.48,8.01c2.35,2.41,4.53,4.85,6.73,7.38c2.2,2.6,4.28,5.23,6.23,8.04
+			c3.14,4.53,5.9,9.11,8.13,14.36h0.05c13.72,17.44,32.15,43.62,28.57,55.07c-1.55,4.74-3.79,7.64-6.18,9.38
+			c-6.78,4.88-15.26,0.65-15.26,0.65s-20.58,0.44-19.69,17.05h62.5c0,0,7.43-10.52,16.26-13.96c8.62-3.51-19.37-72.54-19.74-73.48
+			c0.67,0.39,26.39,15.45,73.86-6.53c48.12-22.28,72.19-48.89,104.89-17.03c32.75,31.91,21.83,34.09,121.54,53.79
+			c0,0,34.1,13.12,19.65,38.88c0,0,0.11,0.44,0,1.09v-1.09c-10.22,9.15-16.4,1.3-16.4,1.3s-20.55,0.44-19.63,17.05h67.59
+			c0,0-1.84-10.52,7.32-13.96c9.24-3.53-10.06-27.97-16.16-50.29c-4.58-16.89-4.53-14.75-15.35-16.86c0,0-0.02,0-0.04-0.02
+			c-0.02,0-0.04-0.02-0.07-0.04c-0.05,0-0.16,0-0.25-0.05h-0.25c-0.25-0.05-0.6-0.16-1.09-0.25h-0.05c-0.21-0.05-0.4-0.09-0.61-0.16
+			c-0.11-0.02-0.19-0.05-0.3-0.07s-0.23-0.05-0.35-0.07c-0.05,0-0.11,0-0.19-0.05c-0.11,0-0.21-0.05-0.25-0.05
+			c-0.05-0.04-0.09-0.04-0.16-0.05c-0.02,0-0.04-0.02-0.05-0.02s-0.04-0.02-0.04-0.02c-0.04-0.02-0.04-0.02-0.07-0.04
+			c-0.05,0-0.09-0.05-0.19-0.05h-0.11c-0.09-0.05-0.19-0.05-0.3-0.05c-0.7-0.21-1.55-0.4-2.41-0.65c-0.09,0-0.16-0.05-0.25-0.05
+			c-0.11,0-0.16-0.05-0.25-0.09c-0.26-0.09-0.53-0.18-0.81-0.26c-0.19-0.05-0.39-0.11-0.56-0.18c-0.18-0.07-0.37-0.11-0.54-0.18
+			c-0.18-0.05-0.37-0.11-0.54-0.18c-0.3-0.11-0.6-0.19-0.91-0.26c-1.14-0.4-2.46-0.79-3.74-1.3c-0.16-0.11-0.33-0.16-0.49-0.25
+			c0-0.02-0.02-0.02-0.02-0.02h-0.02c-0.11-0.04-0.18-0.05-0.23-0.09c-0.04-0.02-0.07-0.04-0.11-0.05c0,0,0,0-0.02-0.02
+			s-0.05-0.04-0.09-0.05c-8.9-3.34-20.58-8.85-31.89-17.65c0,0-0.04-0.04-0.11-0.09c-3.9-3.04-7.76-6.44-11.43-10.29
+			c-0.04-0.04-0.07-0.07-0.11-0.11c-13.26-12.8-34.72-36.3-47.31-64.59c-0.35-0.79-0.74-1.58-1.12-2.35c0-0.02-0.02-0.02-0.02-0.02
+			c-3.25-6.37-7.92-12.15-13.49-17.37c-0.3-0.28-0.6-0.56-0.9-0.83c0.02,0,0.04,0.02,0.05,0.02c-4.79-4.69-10.1-8.9-15.61-12.66
+			l2.81,0.84c0.93,0.3,1.84,0.7,2.77,1.05l1.39,0.53c0.46,0.16,0.93,0.35,1.39,0.58c1.83,0.88,3.67,1.63,5.53,2.69
+			c0.93,0.51,1.84,0.95,2.81,1.51l2.88,1.69c0.95,0.53,2,1.21,2.99,1.83l3.09,1.91l3.21,2.02l3.44,2.12
+			c9.15,5.71,21.35,11.94,34.28,14.31l4.81,0.83c1.62,0.32,3.18,0.35,4.78,0.51l4.76,0.37c1.56,0.04,3.13,0.11,4.65,0.07
+			c6.16-0.02,12.2-0.56,18.16-1.53c11.87-1.93,23.43-5.51,34.4-10.98c5.5-2.72,10.82-5.97,15.89-9.75
+			c5.08-3.76,9.85-8.15,14.14-13.1c4.3-4.93,8.08-10.5,11.08-16.47c3-5.99,5.25-12.35,6.64-18.83
+			C684.92,363.52,684.41,350.44,681.85,338.39z M379.22,175.86l15,10.55l-23.46-8.52L379.22,175.86z M85.99,279.4l11.61-13.42h8.43
+			L85.99,279.4z M150.4,270.47l5.6-12.15l29.31-10.52l-23.99,11.36L150.4,270.47z M70.99,449.54l11.61-13.36h8.52L70.99,449.54z
+			 M170.54,512c-3.69-5.58-5.64-12.36-6.04-19.11c-0.25-3.34-0.05-6.73,0.35-10.06c0.25-0.86,0.35-1.7,0.54-2.6
+			c0.19-1.05,0.4-1.6,0.56-2.44c0.44-1.49,0.68-2.99,0.98-4.53c1.14-6.18,1.69-12.52,1.79-18.81c0.32-12.61-1.39-25.32-4.64-37.48
+			c-0.84-3.09-1.84-6.04-2.99-8.92c-1.14-2.95-2.6-5.74-4.23-8.32c-1.7-2.65-3.69-5.08-6.13-7.02c-1.25-0.95-2.53-1.81-3.99-2.49
+			c-1.44-0.65-2.95-1.16-4.53-1.25c3.2-0.46,6.59,0.65,9.48,2.35c1.74,0.98,3.39,2.23,4.79,3.6c0.65-1.46,1.19-2.9,1.44-4.41
+			c0.35-1.53,0.44-3.09,0.44-4.64c-0.09-3.04-0.79-6.04-1.93-8.87c-1.09-2.84-2.6-5.58-4.34-8.18c-1.4-2.18-2.95-4.34-4.65-6.27
+			l-2.48,0.81c-1.25,0.46-2.55,0.95-3.83,1.39c-1.26,0.54-2.46,1.09-3.69,1.65l-1.7,0.98c-0.6,0.3-1.19,0.6-1.79,1
+			c-2.25,1.39-4.28,3.04-5.94,5.09c-0.51,0.54-0.84,1.09-1.16,1.63c-0.25,0.3-0.46,0.6-0.6,0.9c-0.09,0.3-0.35,0.6-0.44,0.91
+			c-0.54,1.23-0.9,2.53-1.05,3.99c-0.3-1.4-0.3-2.9-0.11-4.36c0.11-0.68,0.35-1.44,0.54-2.12c0.35-0.65,0.6-1.46,0.95-2.05
+			c0.74-1.39,1.55-2.53,2.6-3.74l1.44-1.63c0.61-0.49,1.16-0.95,1.76-1.46c0.54-0.54,1.19-0.93,1.74-1.33l1.84-1.3
+			c1.25-0.65,2.55-1.46,3.83-2.05c1.39-0.6,2.69-1.25,4.04-1.76l4.09-1.44l1.35-0.46l1,1.04c1.28,1.35,2.25,2.65,3.28,3.99
+			c1.05,1.35,2,2.74,2.79,4.2c1.79,2.88,3.2,6.02,4.13,9.41c0.4,1.6,0.79,3.28,0.9,5.04c0.16,1.74,0.05,3.49-0.16,5.18
+			c-0.35,1.69-0.79,3.34-1.49,4.88c-0.81,1.46-1.7,2.84-2.76,4c0.98,0.95,1.84,1.9,2.76,2.97c2.12,2.6,3.88,5.44,5.43,8.43
+			c1.55,2.95,2.84,6.09,3.88,9.17c2.2,6.29,3.69,12.71,4.76,19.25c0.95,6.53,1.33,13.15,1.14,19.79
+			c-0.16,6.62-0.98,13.29-2.46,19.79c-0.35,1.6-0.9,3.2-1.39,4.83c-0.19,0.76-0.54,1.69-0.68,2.2c-0.19,0.68-0.35,1.49-0.46,2.2
+			c-0.65,2.99-1,6.11-1,9.22c0,3.09,0.35,6.18,1.05,9.18c0.65,3.09,1.63,5.99,3.09,8.82c1.44,2.74,3.28,5.34,5.43,7.67
+			c2.11,2.34,4.53,4.5,7.18,6.32C179.46,522.03,174.23,517.67,170.54,512z M207.58,458.21c0.25,2.49,0.76,4.97,1.35,7.57
+			c0.65,2.48,1.6,4.93,2.53,7.48c-2.04-1.79-3.79-4.04-5.18-6.43c-1.35-2.44-2.41-5.02-3.2-7.81c-0.68-2.69-1.04-5.5-1.23-8.29
+			c-0.16-2.83,0-5.62,0.35-8.36c0.6-5.6,2.2-10.98,4.34-16c2.2-4.99,4.83-9.78,8.53-13.91c-1.49,5.18-3.04,10.26-4.25,15.4
+			c-1.23,5.04-2.18,10.12-2.9,15.21C207.32,448.1,207.18,453.17,207.58,458.21z M601.46,548.79c5.23,0.49,10.36,1.46,15.44,2.9
+			c2.49,0.76,4.99,1.65,7.34,2.79c2.39,1.19,4.69,2.6,6.73,4.43l1.46,1.55c0.39,0.49,0.74,0.98,1.19,1.49
+			c0.79,1.05,1.65,2.11,2.46,3.2c1.49,2.09,3.04,4.23,4.37,6.5c2.65,4.48,5.08,9.11,7.18,14l-0.19,0.11
+			c-3.2-4.2-6.09-8.53-8.97-12.82l-4.36-6.48c-0.65-1.09-1.39-2.14-2.12-3.25c-0.4-0.49-0.81-1.04-1.11-1.6l-1.14-1.35
+			c-1.84-1.74-3.9-3.23-6.13-4.37c-2.3-1.25-4.64-2.23-7.13-3.09c-4.83-1.74-9.87-2.93-15.07-3.74L601.46,548.79z M438.98,462.85
+			c-1.6,0.95-3.04,2.09-4.39,3.28c-1.35,1.14-2.6,2.55-3.69,3.99c-0.6,0.65-1.05,1.39-1.55,2.16c-0.46,0.76-0.9,1.55-1.19,2.23v0.05
+			l-0.16,0.21c-2.55,4.07-5.34,8.08-8.59,11.68c-1.39,1.93-3.18,3.64-4.88,5.43c-0.84,0.84-1.69,1.6-2.6,2.49
+			c-0.95,0.79-1.74,1.63-2.74,2.39c-7.39,6.34-15.72,11.52-24.53,15.51c-8.78,4.04-18.16,6.78-27.57,8.52
+			c-4.79,0.84-9.48,1.46-14.29,1.65c-2.46,0.16-4.85,0.19-7.24,0.16c-2.35-0.05-4.69-0.16-7.04-0.46
+			c9.41-1.05,18.65-2.84,27.61-5.34c4.55-1.19,8.92-2.69,13.36-4.28c4.28-1.6,8.62-3.34,12.77-5.39
+			c8.32-3.99,16.24-8.82,23.37-14.59c7.24-5.72,13.66-12.42,19.44-19.74c1.05-1.79,2.25-3.2,3.64-4.55
+			c1.35-1.44,2.95-2.69,4.58-3.74c1.65-1.09,3.34-1.98,5.15-2.63c1.79-0.76,3.74-1.16,5.57-1.51c-0.84,0.4-1.79,0.7-2.58,1.19
+			C440.67,461.95,439.77,462.35,438.98,462.85z M507.47,503.47l2.49,3.6c0.84,1.11,1.6,2.28,2.49,3.39l2.65,3.34l1.39,1.65
+			l1.39,1.49c1.02,1.05,2,2.05,2.99,3.09l3.09,2.84c1.09,1.05,2.2,1.9,3.28,2.79c1.09,0.9,2.2,1.79,3.39,2.63
+			c4.53,3.39,9.43,6.39,14.51,8.94c5.18,2.55,10.57,4.74,16.16,6.18l-0.16,0.54c-5.8-0.98-11.38-2.79-16.7-5.09
+			c-5.34-2.23-10.57-4.97-15.44-8.22c-1.32-0.68-2.49-1.63-3.71-2.49c-1.19-0.9-2.34-1.69-3.48-2.67l-3.35-2.84
+			c-1.09-0.93-2.2-1.98-3.28-2.99l-1.55-1.53l-1.49-1.65l-3.04-3.28c-0.95-1.14-1.81-2.28-2.69-3.49l-2.69-3.42l-1.3-1.65
+			l-1.39-1.55c-0.86-1.09-1.84-1.98-2.79-2.99c-2.05-1.83-4.18-3.64-6.43-5.18c-2.3-1.62-4.58-2.95-7.08-4.23
+			c-2.39-1.25-4.88-2.46-7.52-3.39c-10.27-4.04-21.58-5.9-33.12-6.2l-0.09-0.6c5.69-1.55,11.63-2.05,17.54-1.81
+			c2.93,0.11,5.99,0.46,8.87,0.91c2.99,0.49,5.94,1.3,8.82,2.2c1.4,0.46,2.79,0.98,4.2,1.55c1.39,0.6,2.79,1.23,4.14,1.98
+			c1.33,0.65,2.58,1.46,3.93,2.3c0.6,0.39,1.25,0.84,1.9,1.23c0.61,0.51,1.21,0.95,1.81,1.4C500.04,494,504.13,498.55,507.47,503.47
+			z"/>
+	</g>
+</g>
+</svg>

MythicReactUI/src/cache.js

@@ -0,0 +1,403 @@
+import { makeVar } from '@apollo/client';
+import {restartWebsockets} from "./index";
+import {snackActions} from "./components/utilities/Snackbar";
+import {mergeRefreshedUser} from "./userState";
+
+export const meState = makeVar({loggedIn:false, user: null, access_token: null, refresh_token: null});
+export const alertCount = makeVar(0);
+export const taskTimestampDisplayFieldOptions = [
+    {
+        name: "timestamp",
+        display: "Latest Timestamp for anything task related"
+    },
+    {
+        name: "status_timestamp_preprocessing",
+        display: "When Operator Submitted Task"
+    },
+    {
+        name: "status_timestamp_processing",
+        display: "When Agent Picked up Task",
+    }
+]
+export const taskingDisplayFieldOptions = [
+    {
+        name: "timestamp",
+        display: "Timestamp",
+        description: "Show the configured task timestamp."
+    },
+    {
+        name: "task",
+        display: "Task number",
+        description: "Show the T-number link for each task."
+    },
+    {
+        name: "username",
+        display: "Username",
+        description: "Show the operator that issued the task."
+    },
+    {
+        name: "callback",
+        display: "Callback number",
+        description: "Show the C-number link for the task callback."
+    },
+    {
+        name: "host",
+        display: "Host",
+        description: "Show the callback host."
+    },
+    {
+        name: "ip",
+        display: "IP address",
+        description: "Show the callback primary IP."
+    },
+    {
+        name: "groups",
+        display: "Callback groups",
+        description: "Show the callback's tree groups."
+    },
+    {
+        name: "payload_type",
+        display: "Payload type",
+        description: "Show the task payload type."
+    },
+];
+export const defaultTaskingDisplayFields = ["timestamp", "task", "username", "callback", "payload_type"];
+export const normalizeTaskingDisplayFields = (fields) => {
+    if(!Array.isArray(fields)){
+        return [...defaultTaskingDisplayFields];
+    }
+    const validFieldNames = taskingDisplayFieldOptions.map((option) => option.name);
+    return fields.reduce( (prev, fieldName) => {
+        if(validFieldNames.includes(fieldName) && !prev.includes(fieldName)){
+            return [...prev, fieldName];
+        }
+        return prev;
+    }, []);
+}
+export const taskingContextFieldsOptions = ["impersonation_context", "cwd", "user", "host", "ip", "pid", "process_short_name", "extra_info", "architecture"].sort();
+export const defaultShortcuts = [
+    "ActiveCallbacks", "Payloads", "PayloadTypesAndC2",
+    "Operations", "SearchFiles", "SearchProxies",
+    "CreatePayload", "Eventing", "Chat",
+].sort();
+export const operatorSettingDefaults =  {
+    navBarOpen: false,
+    fontFamily: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
+    showMedia: true,
+    showOPSECBypassUsername: false,
+    taskingDisplayFields: defaultTaskingDisplayFields,
+    useDisplayParamsForCLIHistory: true,
+    interactType: "interactSplit",
+    taskTimestampDisplayField: "timestamp",
+    callbacks_table_columns: ["Interact", "Host", "Domain", "User", "Description", "Last Checkin", "Agent",  "IP", "PID"],
+    callbacks_table_filters: {},
+    autoTaskLsOnEmptyDirectories: false,
+    hideBrowserTasking: false,
+    hideTaskingContext: false,
+    taskingContextFields: ["impersonation_context", "cwd"],
+    ["experiment-responseStreamLimit"]: 200,
+    chatSelectedChannelID: 0,
+    virtualizedTablePadding: 8,
+    sideShortcuts: defaultShortcuts,
+    palette: {
+        primary: {
+            dark: "#7dd3fc",
+            light: "#2563eb",
+        },
+        error: {
+            dark: '#fb7185',
+            light: '#dc2626'
+        },
+        success: {
+            dark: '#34d399',
+            light: '#15803d',
+        },
+        secondary: {
+            dark: '#94a3b8',
+            light: '#64748b'
+        },
+        info: {
+            dark: '#22d3ee',
+            light: '#0891b2'
+        },
+        warning: {
+            dark: "#fbbf24",
+            light: "#b45309",
+        },
+        background: {
+            dark: '#0b0f14',
+            light: '#f6f8fb'
+        },
+        paper: {
+            dark: '#111820',
+            light: '#ffffff'
+        },
+        surfaceRaised: {
+            dark: '#16212b',
+            light: '#ffffff'
+        },
+        surfaceMuted: {
+            dark: '#0f1720',
+            light: '#fafbfc'
+        },
+        tableHeader: {
+            dark: '#17212c',
+            light: '#e8eef5'
+        },
+        tableHover: {
+            dark: "#1e2a36",
+            light: "#eaf1f8",
+        },
+        pageHeader: {
+            dark: '#111a23',
+            light: '#ffffff'
+        },
+        pageHeaderText: {
+            dark: "#e7edf5",
+            light: "#0f172a",
+        },
+        chatMessageOperatorBackground: {
+            dark: "#111820",
+            light: "#ffffff",
+        },
+        chatMessageSelfBackground: {
+            dark: "#142033",
+            light: "#f8fbff",
+        },
+        chatMessageSystemBackground: {
+            dark: "#2a2116",
+            light: "#fff7ed",
+        },
+        chatMarkdownSurfaceBackground: {
+            dark: "#0b1118",
+            light: "#f5f5f5",
+        },
+        chatMarkdownSurfaceStrongBackground: {
+            dark: "#1f2a37",
+            light: "#e2e8f0",
+        },
+        sectionHeaderAccent: {
+            dark: "#7dd3fc",
+            light: "#b3cbff",
+        },
+        sectionHeaderGradientStart: {
+            dark: "#153049",
+            light: "#dbeafe",
+        },
+        sectionHeaderGradientMiddle: {
+            dark: "#111f2e",
+            light: "#eef6ff",
+        },
+        sectionHeaderGradientEnd: {
+            dark: "#111820",
+            light: "#ffffff",
+        },
+        subtleAccentGradientStart: {
+            dark: "#132338",
+            light: "#eef6ff",
+        },
+        subtleAccentGradientEnd: {
+            dark: "#111820",
+            light: "#ffffff",
+        },
+        graphGroupColor: {
+            dark: "#24384a",
+            light: "#d9e6f2",
+        },
+        chartSeries1: {
+            dark: "#38bdf8",
+            light: "#0284c7",
+        },
+        chartSeries2: {
+            dark: "#34d399",
+            light: "#16a34a",
+        },
+        chartSeries3: {
+            dark: "#fbbf24",
+            light: "#ca8a04",
+        },
+        chartSeries4: {
+            dark: "#fb7185",
+            light: "#e11d48",
+        },
+        chartSeries5: {
+            dark: "#a78bfa",
+            light: "#7c3aed",
+        },
+        chartSeries6: {
+            dark: "#2dd4bf",
+            light: "#0d9488",
+        },
+        chartSeries7: {
+            dark: "#f472b6",
+            light: "#db2777",
+        },
+        chartSeries8: {
+            dark: "#f97316",
+            light: "#ea580c",
+        },
+        chartSeries9: {
+            dark: "#818cf8",
+            light: "#4f46e5",
+        },
+        chartSeries10: {
+            dark: "#a3e635",
+            light: "#65a30d",
+        },
+        text: {
+            dark: "#e6edf3",
+            light: "#111827",
+        },
+        textSecondary: {
+            dark: "#a7b2c2",
+            light: "#526174",
+        },
+        textDisabled: {
+            dark: "#6f7c8d",
+            light: "#93a1b2",
+        },
+        selectedCallbackColor: {
+            dark: '#123a5a',
+            light: '#dbeafe',
+        },
+        selectedCallbackHierarchyColor: {
+            dark: '#172d49',
+            light: '#edf6ff',
+        },
+        backgroundImage: {
+            dark: null,
+            light: null
+        },
+        navBarIcons: {
+            dark: '#dce8f8',
+            light: '#ffffff'
+        },
+        navBarText: {
+            dark: '#dce8f8',
+            light: '#ffffff'
+        },
+        navBarColor: {
+            dark: "#1a283d",
+            light: "#5c73a5",
+        },
+        navBarBottomColor: {
+            dark: "#0c131c",
+            light: "#1f2937",
+        },
+        taskPromptTextColor: {
+            dark: '#9fb3c8',
+            light: '#64748b'
+        },
+        taskPromptCommandTextColor: {
+            dark: "#f8fafc",
+            light: "#0f172a",
+        },
+        taskContextColor: {
+            dark: "#14324f",
+            light: "#dbeafe",
+        },
+        taskContextImpersonationColor: {
+            dark: "#4a1824",
+            light: "#fee2e2",
+        },
+        taskContextExtraColor: {
+            dark: "#123a35",
+            light: "#dcfce7",
+        },
+        emptyFolderColor: {
+            dark: '#8997aa',
+            light: '#64748b'
+        },
+        folderColor: {
+            dark: '#f2c86b',
+            light: '#d6a23f'
+        },
+        outputBackgroundColor: {
+            dark: '#070b10',
+            light: '#f8fafc'
+        },
+        outputTextColor: {
+            dark: '#e6edf3',
+            light: '#111827',
+        },
+        borderColor: {
+            dark: "#263241",
+            light: "#d5dee9"
+        }
+    },
+}
+
+export const mePreferences = makeVar(operatorSettingDefaults);
+
+
+export const successfulLogin = (data) => {
+    localStorage.setItem("access_token", data.access_token);
+    localStorage.setItem("refresh_token", data.refresh_token);
+    let now = new Date();
+    let serverNow = new Date(data.user.current_utc_time);
+    const difference = (serverNow.getTime() - now.getTime());
+    let me = {...data.user};
+    me.server_skew = difference;
+    me.login_time = now;
+    meState({
+        loggedIn: true,
+        access_token: data.access_token,
+        refresh_token: data.refresh_token,
+        user: {
+            ...me
+        }
+    });
+    localStorage.setItem("user", JSON.stringify(me));
+    restartWebsockets();
+}
+export const successfulRefresh = (data) => {
+    localStorage.setItem("access_token", data.access_token);
+    localStorage.setItem("refresh_token", data.refresh_token);
+    let now = new Date();
+    let serverNow = new Date(data.user.current_utc_time);
+    const difference = (serverNow.getTime() - now.getTime()) ;
+    let me = mergeRefreshedUser(meState().user, data.user);
+    me.server_skew = difference;
+    me.login_time = now;
+    meState({
+        loggedIn: true,
+        access_token: data.access_token,
+        refresh_token: data.refresh_token,
+        user: {
+            ...me
+        }
+    });
+    localStorage.setItem("user", JSON.stringify(me));
+}
+export const FailedRefresh = (restart_websockets) =>{
+    const accessToken = localStorage.getItem("access_token");
+    if(accessToken){
+        fetch('/logout', {
+            method: 'POST',
+            headers: {'Authorization': `Bearer ${accessToken}`},
+            keepalive: true,
+        }).catch(() => {});
+    }
+    console.log("failed refresh");
+    localStorage.removeItem("access_token");
+    localStorage.removeItem("refresh_token");
+    localStorage.removeItem("user");
+    // retrieve all cookies
+    let Cookies = document.cookie.split(';');
+    // set past expiry to all cookies
+    for (let i = 0; i < Cookies.length; i++) {
+        document.cookie = Cookies[i] + "=; expires="+ new Date(0).toUTCString();
+    }
+    meState({
+        loggedIn: false,
+        access_token: null,
+        refresh_token: null,
+        user: null
+    });
+    mePreferences(operatorSettingDefaults);
+    snackActions.clearAll();
+    if(restart_websockets){
+        restartWebsockets();
+    }
+
+}

MythicReactUI/src/components/EventFeedNotifications.js

@@ -0,0 +1,69 @@
+import React, {useEffect} from 'react';
+import {gql, useSubscription} from '@apollo/client';
+import {snackActions} from './utilities/Snackbar';
+import {getSkewedNow} from "./utilities/Time";
+
+//fromNow must be in ISO format for hasura/postgres stuff
+//new Date().toISOString() will do it
+
+const subscribe_payloads = gql`
+ subscription EventFeedNotificationSubscription($fromNow: timestamp!) {
+   operationeventlog_stream(cursor: {initial_value: {timestamp: $fromNow}, ordering: ASC}, batch_size: 1, where: {deleted: {_eq: false}}) {
+     operator {
+         username
+     }
+     id
+     message
+     level
+     resolved
+     source
+     warning
+   }
+ }
+  `;
+
+export function EventFeedNotifications() {
+    const [fromNow, setFromNow] = React.useState(getSkewedNow().toISOString());
+    //const fromNow = React.useRef(  );
+    useSubscription(subscribe_payloads, {
+        variables: {fromNow: fromNow },
+        fetchPolicy: "no-cache",
+        shouldResubscribe: true,
+        onError: (errorData) => {
+           console.log(errorData);
+        },
+        onData: ({data}) => {
+            if (data.data.operationeventlog_stream.length > 0){
+                if(data.data.operationeventlog_stream[0].level === "api" ||
+                    data.data.operationeventlog_stream[0].level === "debug" ||
+                    data.data.operationeventlog_stream[0].level === "agent"
+                ){
+                    return;
+                }
+                if(data.data.operationeventlog_stream[0].resolved){
+                    return;
+                }
+                if(data.data.operationeventlog_stream[0].operator){
+                    const message = data.data.operationeventlog_stream[0].operator.username + ":\n" + data.data.operationeventlog_stream[0].message;
+                    if (data.data.operationeventlog_stream[0].warning) {
+                        snackActions.warning(message, { autoClose: 2000});
+                    } else {
+                        snackActions.info(message, { autoClose: 2000});
+                    }
+
+                }else {
+                    if (data.data.operationeventlog_stream[0].warning) {
+                        snackActions.warning(data.data.operationeventlog_stream[0].message, {autoClose: 3000});
+                    } else {
+                        snackActions.info(
+                            <div style={{width: "100%"}}>{data.data.operationeventlog_stream[0].message}</div>,
+                            {autoClose: 3000});
+                    }
+
+                }
+                }
+        }
+    });
+    return null
+}
+

MythicReactUI/src/components/MythicComponents/APITokenScopeSelector.js

@@ -0,0 +1,291 @@
+import React from 'react';
+import {Box, Checkbox, InputAdornment, TextField, Typography} from '@mui/material';
+import {MythicActionButton} from './MythicActionButton';
+import SearchIcon from '@mui/icons-material/Search';
+import {gql, useQuery} from "@apollo/client";
+import {MythicChip} from './MythicChip';
+
+export const defaultAPITokenScopes = ["*"];
+
+export const apiTokenScopeDefinitionsQuery = gql`
+query apiTokenScopeDefinitionsQuery {
+  apiTokenScopeDefinitions {
+    status
+    error
+    scopes {
+      name
+      display_name
+      description
+      resource
+      access
+      includes
+    }
+    grantable_wildcards
+  }
+}
+`;
+
+export const normalizeAPITokenScopeSelection = (scopes = []) => {
+    const uniqueScopes = Array.from(new Set((scopes || []).filter((scope) => Boolean(scope)))).sort();
+    if(uniqueScopes.includes("*")){
+        return ["*"];
+    }
+    return uniqueScopes.reduce((prev, scope) => {
+        const resource = scope.endsWith(".*") ? scope.slice(0, -2) : scope.split(".")[0];
+        if(scope.endsWith(".*")){
+            return [
+                ...prev.filter((selectedScope) => !selectedScope.startsWith(`${resource}.`)),
+                scope,
+            ].sort();
+        }
+        if(prev.includes(`${resource}.*`)){
+            return prev;
+        }
+        return [...prev, scope].sort();
+    }, []);
+};
+
+export function APITokenScopeSelector({
+    selectedScopes = [],
+    onChange,
+    requiredScopes = [],
+    requiredScopeDescriptions = {},
+    fetchPolicy = "cache-first",
+    libraryMaxHeight,
+    className = "",
+    sx = {},
+}) {
+    const [filter, setFilter] = React.useState("");
+    const normalizedSelectedScopes = React.useMemo(() => {
+        return normalizeAPITokenScopeSelection(selectedScopes);
+    }, [selectedScopes]);
+    const {data: scopeData, loading: scopeLoading, error: scopeQueryError} = useQuery(apiTokenScopeDefinitionsQuery, {
+        fetchPolicy,
+    });
+    const availableScopes = React.useMemo(() => {
+        if(scopeData?.apiTokenScopeDefinitions?.status !== "success"){
+            return [];
+        }
+        return scopeData?.apiTokenScopeDefinitions?.scopes || [];
+    }, [scopeData]);
+    const grantableWildcards = React.useMemo(() => {
+        return scopeData?.apiTokenScopeDefinitions?.grantable_wildcards || [];
+    }, [scopeData]);
+    const groupedScopes = React.useMemo(() => {
+        return availableScopes.reduce((prev, cur) => {
+            const resource = cur.resource || "other";
+            return {
+                ...prev,
+                [resource]: [...(prev[resource] || []), cur],
+            };
+        }, {});
+    }, [availableScopes]);
+    const visibleResources = React.useMemo(() => {
+        const normalizedFilter = filter.toLowerCase();
+        return Object.keys(groupedScopes).sort().filter(resource => {
+            if(normalizedFilter === ""){
+                return true;
+            }
+            if(resource.toLowerCase().includes(normalizedFilter)){
+                return true;
+            }
+            return groupedScopes[resource].some(scope =>
+                scope.name.toLowerCase().includes(normalizedFilter) ||
+                (scope.display_name || "").toLowerCase().includes(normalizedFilter) ||
+                (scope.description || "").toLowerCase().includes(normalizedFilter)
+            );
+        });
+    }, [filter, groupedScopes]);
+    const visibleScopeCount = React.useMemo(() => {
+        return visibleResources.reduce((prev, resource) => prev + groupedScopes[resource].length, 0);
+    }, [groupedScopes, visibleResources]);
+    const scopeLoadFailed = scopeQueryError !== undefined || scopeData?.apiTokenScopeDefinitions?.status === "error";
+    const scopesUnavailable = scopeLoading || scopeLoadFailed;
+    const selectedScopesLabel = normalizedSelectedScopes.includes("*") ? "Full access selected" : `${normalizedSelectedScopes.length} selected`;
+    const fullAccessDisabled = !grantableWildcards.includes("*");
+    const emitScopes = (nextScopes) => {
+        if(onChange){
+            onChange(normalizeAPITokenScopeSelection(nextScopes));
+        }
+    }
+    const scopeIsSelected = (scope) => {
+        return normalizedSelectedScopes.includes(scope);
+    }
+    const toggleScope = (scope) => {
+        if(scope === "*"){
+            emitScopes(scopeIsSelected("*") ? [] : defaultAPITokenScopes);
+            return;
+        }
+        const resource = scope.endsWith(".*") ? scope.slice(0, -2) : scope.split(".")[0];
+        const withoutAll = normalizedSelectedScopes.filter(s => s !== "*");
+        const withoutResourceWildcard = withoutAll.filter(s => s !== `${resource}.*`);
+        if(scope.endsWith(".*")){
+            emitScopes(normalizedSelectedScopes.includes(scope) ? withoutResourceWildcard : [
+                ...withoutResourceWildcard.filter(s => !s.startsWith(`${resource}.`)),
+                scope,
+            ].sort());
+            return;
+        }
+        if(normalizedSelectedScopes.includes(scope)){
+            emitScopes(withoutResourceWildcard.filter(s => s !== scope));
+            return;
+        }
+        emitScopes([...withoutResourceWildcard, scope].sort());
+    }
+    const selectVisibleScopes = () => {
+        const visibleScopeNames = visibleResources.flatMap(resource => groupedScopes[resource].map(scope => scope.name));
+        emitScopes(Array.from(new Set([
+            ...normalizedSelectedScopes.filter(scope => scope !== "*"),
+            ...visibleScopeNames,
+        ])).sort());
+    }
+    const clearScopes = () => {
+        emitScopes([]);
+    }
+    const librarySx = libraryMaxHeight === undefined ? undefined : {maxHeight: libraryMaxHeight};
+
+    return (
+        <Box className={className} sx={sx}>
+            <Box sx={{alignItems: "center", display: "flex", flexWrap: "wrap", gap: 0.75, mb: 1}}>
+                <MythicChip label={`${visibleScopeCount} visible`} />
+                <MythicChip label={selectedScopesLabel} />
+                <MythicActionButton disabled={scopesUnavailable || visibleScopeCount === 0 || scopeIsSelected("*")} size="small" onClick={selectVisibleScopes}>
+                    Select Visible
+                </MythicActionButton>
+                <MythicActionButton disabled={normalizedSelectedScopes.length === 0} size="small" onClick={clearScopes}>
+                    Clear
+                </MythicActionButton>
+            </Box>
+            {requiredScopes.length > 0 &&
+                <Box className="mythic-api-token-scope-card items-start flex gap-3 mythic-api-token-scope-card-selected min-w-0 rounded cursor-pointer bg-surface border-subtle text-primary mythic-tone-primary bg-tone-1 border-tone-3" sx={{mb: 1.25}}>
+                    <Box className="mythic-api-token-scope-card-copy min-w-0 w-full">
+                        <Typography className="mythic-api-token-scope-card-title text-sm font-800 leading-125 min-w-0 wrap-anywhere text-primary">Needed for this use</Typography>
+                        {requiredScopes.map((scope) => (
+                            <Typography key={`required-${scope}`} variant="caption" color="text.secondary" sx={{display: "block"}}>
+                                {scope}: {requiredScopeDescriptions[scope] || "Required for this workflow."}
+                            </Typography>
+                        ))}
+                    </Box>
+                </Box>
+            }
+            <TextField
+                className="mythic-api-token-scope-search"
+                size="small"
+                fullWidth
+                value={filter}
+                onChange={(event) => setFilter(event.target.value)}
+                placeholder="Search scopes"
+                disabled={scopesUnavailable}
+                InputProps={{startAdornment: <InputAdornment position="start"><SearchIcon fontSize="small" /></InputAdornment>}}
+            />
+            <Box className="mythic-api-token-scope-library flex flex-column gap-5 overflow-auto rounded bg-neutral-1 border-subtle" sx={librarySx}>
+                {scopesUnavailable &&
+                    <Box className={`mythic-api-token-scope-state items-center flex justify-center rounded bg-surface-raised border-subtle text-muted text-center${scopeLoadFailed ? " mythic-api-token-scope-state-error mythic-tone-error bg-tone-1 border-tone-3 text-tone" : ""}`}>
+                        <Typography variant="body2">
+                            {scopeLoading ? "Loading scopes..." : (scopeQueryError?.message || scopeData?.apiTokenScopeDefinitions?.error || "Failed to load scopes")}
+                        </Typography>
+                    </Box>
+                }
+                {!scopesUnavailable &&
+                    <>
+                        <Box
+                            className={`mythic-api-token-scope-card items-start flex gap-3 mythic-api-token-scope-card-full rounded cursor-pointer bg-surface border-subtle text-primary mythic-tone-warning bg-tone-1 border-tone-2${scopeIsSelected("*") ? " mythic-api-token-scope-card-selected mythic-tone-primary bg-tone-1 border-tone-3" : ""}${fullAccessDisabled ? " mythic-api-token-scope-card-disabled" : ""} min-w-0`}
+                            component="label"
+                        >
+                            <Checkbox
+                                disabled={fullAccessDisabled}
+                                checked={scopeIsSelected("*")}
+                                onChange={() => toggleScope("*")}
+                            />
+                            <Box className="mythic-api-token-scope-card-copy min-w-0 w-full">
+                                <Typography className="mythic-api-token-scope-card-title text-sm font-800 leading-125 min-w-0 wrap-anywhere text-primary">Full access (*)</Typography>
+                                <Typography className="mythic-api-token-scope-card-description text-xs leading-135 wrap-anywhere text-muted">
+                                    Grants every current and future API scope available to this operator.
+                                </Typography>
+                            </Box>
+                        </Box>
+                        {visibleResources.length === 0 &&
+                            <Box className="mythic-api-token-scope-state items-center flex justify-center rounded bg-surface-raised border-subtle text-muted text-center">
+                                <Typography variant="body2">No scopes match your search.</Typography>
+                            </Box>
+                        }
+                        {visibleResources.map(resource => {
+                            const resourceWildcard = `${resource}.*`;
+                            const canGrantResourceWildcard = grantableWildcards.includes(resourceWildcard);
+                            const resourceScopes = [...groupedScopes[resource]].sort((a, b) => (a.access || "").localeCompare(b.access || ""));
+                            const resourceWildcardSelected = scopeIsSelected("*") || scopeIsSelected(resourceWildcard);
+                            return (
+                                <Box className="mythic-api-token-resource-card p-6 flex flex-column gap-5 min-w-0 rounded bg-surface-raised border-subtle" key={resource}>
+                                    <Box className="mythic-api-token-resource-header items-start flex flex-wrap gap-6 justify-between min-w-0">
+                                        <Box sx={{minWidth: 0}}>
+                                            <Typography className="mythic-api-token-resource-title text-sm font-800 leading-120 text-primary">
+                                                {resource.split("_").join(" ")}
+                                            </Typography>
+                                            <Typography className="mythic-api-token-resource-subtitle">
+                                                {resourceScopes.length === 1 ? "1 available scope" : `${resourceScopes.length} available scopes`}
+                                            </Typography>
+                                        </Box>
+                                        <Box
+                                            className={`mythic-api-token-resource-wildcard text-xs font-750 items-center inline-flex flex-none gap-2 rounded cursor-pointer bg-neutral-1 border-subtle text-muted${resourceWildcardSelected ? " mythic-api-token-resource-wildcard-selected" : ""}${!canGrantResourceWildcard ? " mythic-api-token-resource-wildcard-disabled" : ""}`}
+                                            component="label"
+                                        >
+                                            <Checkbox
+                                                size="small"
+                                                disabled={scopeIsSelected("*") || !canGrantResourceWildcard}
+                                                checked={resourceWildcardSelected}
+                                                onChange={() => toggleScope(resourceWildcard)}
+                                            />
+                                            <span>{resourceWildcard}</span>
+                                        </Box>
+                                    </Box>
+                                    <Box className="mythic-api-token-scope-grid gap-4 min-w-0 grid">
+                                        {resourceScopes.map(scope => {
+                                            const includedByWildcard = scopeIsSelected("*") || scopeIsSelected(resourceWildcard);
+                                            const scopeSelected = scopeIsSelected(scope.name) || includedByWildcard;
+                                            return (
+                                                <Box
+                                                    className={`mythic-api-token-scope-card items-start flex gap-3 rounded cursor-pointer bg-surface border-subtle text-primary${scopeSelected ? " mythic-api-token-scope-card-selected mythic-tone-primary bg-tone-1 border-tone-3" : ""}${includedByWildcard ? " mythic-api-token-scope-card-inherited" : ""} min-w-0`}
+                                                    component="label"
+                                                    key={scope.name}
+                                                >
+                                                    <Checkbox
+                                                        size="small"
+                                                        disabled={includedByWildcard}
+                                                        checked={scopeSelected}
+                                                        onChange={() => toggleScope(scope.name)}
+                                                    />
+                                                    <Box className="mythic-api-token-scope-card-copy min-w-0 w-full">
+                                                        <Box className="mythic-api-token-scope-card-title-row items-start flex gap-4 justify-between min-w-0">
+                                                            <Typography className="mythic-api-token-scope-card-title text-sm font-800 leading-125 min-w-0 wrap-anywhere text-primary">{scope.display_name || scope.name}</Typography>
+                                                            <MythicChip
+                                                                compact
+                                                                label={scope.access || "scope"}
+                                                                size="small"
+                                                                tone={scope.access === "read" ? "info" : ["write", "create", "update"].includes(scope.access) ? "success" : ["delete", "admin"].includes(scope.access) ? "error" : "neutral"}
+                                                            />
+                                                        </Box>
+                                                        <Typography className="mythic-api-token-scope-name text-xs leading-135 wrap-anywhere text-muted font-mono">
+                                                            {scope.name}
+                                                        </Typography>
+                                                        <Typography className="mythic-api-token-scope-card-description text-xs leading-135 wrap-anywhere text-muted">
+                                                            {scope.description}
+                                                        </Typography>
+                                                        {scope.includes?.length > 0 &&
+                                                            <Typography className="mythic-api-token-scope-includes text-xs leading-135 font-700 wrap-anywhere mythic-tone-info text-tone">
+                                                                Includes {scope.includes.join(", ")}
+                                                            </Typography>
+                                                        }
+                                                    </Box>
+                                                </Box>
+                                            )
+                                        })}
+                                    </Box>
+                                </Box>
+                            );
+                        })}
+                    </>
+                }
+            </Box>
+        </Box>
+    )
+}

MythicReactUI/src/components/MythicComponents/MythicActionButton.js

@@ -0,0 +1,82 @@
+import React from 'react';
+import Button from '@mui/material/Button';
+import IconButton from '@mui/material/IconButton';
+import {normalizeMythicChipTone} from './MythicChip';
+import {MythicStyledTooltip} from './MythicStyledTooltip';
+
+export const MythicActionButton = React.forwardRef(function MythicActionButton({
+    active = false,
+    appearance, // can be plain or raised
+    autoWidth = false,
+    children,
+    className = "",
+    colorMode = "hover", // can be always or hover
+    compact = false,
+    icon,
+    iconOnly = false,
+    label,
+    muted = false,
+    rotated = false,
+    selected = false,
+    shape, // can be square or round
+    size = "small",
+    startIcon,
+    tone = "neutral",
+    tooltip,
+    tooltipStyle = {},
+    variant = "outlined",
+    ...props
+}, ref) {
+    const resolvedTone = normalizeMythicChipTone(tone);
+    const resolvedAppearance = appearance || (iconOnly ? "plain" : "raised");
+    const resolvedShape = shape || (resolvedAppearance === "raised" ? "square" : "round");
+    const resolvedColorMode = colorMode === "always" ? "always" : "hover";
+    const shapeClass = iconOnly ? "mythic-action-button-icon" : "mythic-action-button-label";
+    const resolvedClassName = [
+        "mythic-action-button",
+        `mythic-action-button-${resolvedAppearance}`,
+        shapeClass,
+        `mythic-action-button-shape-${resolvedShape}`,
+        `mythic-action-button-color-${resolvedColorMode}`,
+        `mythic-tone-${resolvedTone}`,
+        active || selected ? "mythic-action-button-active" : "",
+        autoWidth ? "mythic-action-button-auto-width" : "",
+        compact ? "mythic-action-button-compact" : "",
+        muted ? "mythic-action-button-muted" : "",
+        rotated ? "mythic-action-button-rotated" : "",
+        className,
+    ].filter(Boolean).join(" ");
+    const ariaLabel = props["aria-label"] || tooltip || (typeof label === "string" ? label : undefined);
+    const content = label ?? children;
+    const button = iconOnly ? (
+        <IconButton
+            ref={ref}
+            aria-label={ariaLabel}
+            size={size}
+            {...props}
+            className={resolvedClassName}
+            color="inherit"
+        >
+            {icon || children}
+        </IconButton>
+    ) : (
+        <Button
+            ref={ref}
+            aria-label={ariaLabel}
+            size={size}
+            startIcon={icon || startIcon}
+            variant={variant}
+            {...props}
+            className={resolvedClassName}
+            color="inherit"
+        >
+            {content}
+        </Button>
+    );
+
+    return tooltip ? (
+        <MythicStyledTooltip title={tooltip} tooltipStyle={{display: "inline-flex", ...tooltipStyle}}>
+            {button}
+        </MythicStyledTooltip>
+    ) : button;
+});

MythicReactUI/src/components/MythicComponents/MythicAgentSVGIcon.js

@@ -0,0 +1,55 @@
+import {useTheme} from '@mui/material/styles';
+import {MythicStyledTooltip} from "./MythicStyledTooltip";
+import WifiIcon from '@mui/icons-material/Wifi';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import { faLink } from '@fortawesome/free-solid-svg-icons';
+import {ImageWithAuth} from "../utilities/ImageWithAuth";
+
+export const MythicAgentSVGIcon = ({payload_type, style, is_p2p}) => {
+    const theme = useTheme();
+    if(payload_type === ""){
+        return;
+    }
+    return (
+        <MythicStyledTooltip title={payload_type} >
+            <ImageWithAuth src={"/static/" + payload_type + "_" + theme.palette.mode + ".svg"}
+                           style={{...style}} />
+            {is_p2p === false &&
+                <WifiIcon style={{width: "20px", height: "20px", marginLeft: "-20px", marginBottom: "5px",
+                borderRadius: "10px", border: "1px solid",
+                backgroundColor: theme.palette.background.default}}/>
+            }
+            {is_p2p === true &&
+                <FontAwesomeIcon icon={faLink} style={{width: "20px", height: "20px", marginLeft: "-20px", marginBottom: "5px",
+                    borderRadius: "10px", border: "1px solid",
+                    backgroundColor: theme.palette.background.default}} />
+            }
+        </MythicStyledTooltip>
+
+    )
+}
+export const MythicAgentSVGIconNoTooltip = ({payload_type, is_p2p, className, style}) => {
+    const theme = useTheme();
+    if(payload_type === ""){
+        return;
+    }
+    const extraStyles = style ? style : {};
+    return (
+        <div style={{display: "inline-block", left: "50%"}} className={className}>
+            <ImageWithAuth src={"/static/" + payload_type + "_" + theme.palette.mode + ".svg"}
+                           style={{height: "20px", margin: 'auto', ...extraStyles}} />
+            {is_p2p === false &&
+                <WifiIcon style={{width: "10px", height: "10px", marginLeft: "-5px", marginBottom: "0px",
+                    borderRadius: "10px", border: "1px solid",
+                    backgroundColor: theme.palette.primary.main, color: "white" }} />
+            }
+            {is_p2p === true &&
+                <FontAwesomeIcon icon={faLink} style={{width: "10px", height: "10px", marginLeft: "-5px", marginBottom: "0px",
+                    borderRadius: "10px",  border: "1px solid",
+                    backgroundColor: theme.palette.primary.main, color: "white"}} />
+            }
+        </div>
+
+
+    )
+}

MythicReactUI/src/components/MythicComponents/MythicChatContainerIcon.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import {useTheme} from '@mui/material/styles';
+import SmartToyTwoToneIcon from '@mui/icons-material/SmartToyTwoTone';
+import {ImageWithAuth} from "../utilities/ImageWithAuth";
+
+const defaultIconProps = {fontSize: "small"};
+
+const shallowEqualObjects = (left = {}, right = {}) => {
+    if(left === right){
+        return true;
+    }
+    const leftKeys = Object.keys(left);
+    const rightKeys = Object.keys(right);
+    if(leftKeys.length !== rightKeys.length){
+        return false;
+    }
+    return leftKeys.every((key) => left[key] === right[key]);
+};
+
+const MythicChatContainerIconComponent = ({containerName, className = "", imgClassName = "", iconProps = defaultIconProps, altText}) => {
+    const theme = useTheme();
+    const [imageFailed, setImageFailed] = React.useState(false);
+    const iconName = String(containerName || "").trim();
+    const imageSrc = iconName ? `/static/${iconName}_${theme.palette.mode}.svg` : "";
+    const handleImageError = React.useCallback(() => {
+        setImageFailed(true);
+    }, []);
+    React.useEffect(() => {
+        setImageFailed(false);
+    }, [imageSrc]);
+    if(!imageSrc || imageFailed){
+        return <SmartToyTwoToneIcon {...iconProps} />;
+    }
+    return (
+        <ImageWithAuth
+            alt={altText || iconName}
+            className={`${className} ${imgClassName}`.trim()}
+            onError={handleImageError}
+            src={imageSrc}
+        />
+    );
+};
+
+export const MythicChatContainerIcon = React.memo(MythicChatContainerIconComponent, (previousProps, nextProps) => (
+    previousProps.containerName === nextProps.containerName &&
+    previousProps.className === nextProps.className &&
+    previousProps.imgClassName === nextProps.imgClassName &&
+    previousProps.altText === nextProps.altText &&
+    shallowEqualObjects(previousProps.iconProps || defaultIconProps, nextProps.iconProps || defaultIconProps)
+));

MythicReactUI/src/components/MythicComponents/MythicChip.js

@@ -0,0 +1,69 @@
+import React from 'react';
+import Chip from '@mui/material/Chip';
+import {useTheme} from "@mui/material/styles";
+
+const supportedTones = new Set([
+    "primary",
+    "secondary",
+    "neutral",
+    "info",
+    "success",
+    "warning",
+    "error",
+]);
+
+export const normalizeMythicChipTone = (tone) => supportedTones.has(tone) ? tone : "secondary";
+
+const ChipPrimitive = React.forwardRef(function ChipPrimitive({
+    className = "",
+    color = undefined,
+    compact = false,
+    iconOnly = false,
+    muted = false,
+    shape,
+    size = "small",
+    tone = undefined,
+    variant = "outlined",
+    ...props
+}, ref) {
+    const resolvedTone = normalizeMythicChipTone(tone || (color ? color : "secondary"));
+    const muiVariant = variant ? variant : "outlined";
+    const hasCustomColor = Boolean(color) && !supportedTones.has(color);
+    const resolvedClassName = [
+        "mythic-chip-base",
+        "text-xs",
+        "font-800",
+        "items-center",
+        "inline-flex",
+        "gap-2",
+        "max-w-full",
+        "min-w-0",
+        "truncate",
+        "whitespace-nowrap",
+        shape === "square" ? "mythic-square-chip" : "mythic-chip",
+        hasCustomColor ? "mythic-chip-custom-color" : `mythic-tone-${resolvedTone}`,
+        compact ? "mythic-chip-compact text-2xs" : "",
+        muted ? "mythic-chip-muted" : "",
+        iconOnly ? "mythic-chip-icon-only justify-center" : "",
+        variant === "outlined" ? "mythic-chip-outlined" : "",
+        className,
+    ].filter(Boolean).join(" ");
+    return (
+        <Chip
+            ref={ref}
+            className={resolvedClassName}
+            //color={color ? color : undefined}
+            size={size}
+            variant={muiVariant}
+            {...props}
+        />
+    );
+});
+
+export const MythicChip = React.forwardRef(function MythicChip(props, ref) {
+    return <ChipPrimitive ref={ref} shape="pill" {...props} />;
+});
+
+export const SquareChip = React.forwardRef(function SquareChip(props, ref) {
+    return <ChipPrimitive ref={ref} shape="square" {...props} />;
+});

MythicReactUI/src/components/MythicComponents/MythicColorInput.js

@@ -0,0 +1,120 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import ClickAwayListener from '@mui/material/ClickAwayListener';
+import Popper from '@mui/material/Popper';
+import {HexColorInput, HexColorPicker} from 'react-colorful';
+
+export const isValidHexColor = (color) => {
+    if(typeof color !== "string"){
+        return false;
+    }
+    if(color.length !== 7){
+        return false;
+    }
+    if(color[0] !== "#"){
+        return false;
+    }
+    return /^#[0-9a-fA-F]{6}$/.test(color);
+}
+
+export const getReadableTextColor = (backgroundColor) => {
+    if(!isValidHexColor(backgroundColor)){
+        return "#ffffff";
+    }
+    const red = parseInt(backgroundColor.slice(1, 3), 16);
+    const green = parseInt(backgroundColor.slice(3, 5), 16);
+    const blue = parseInt(backgroundColor.slice(5, 7), 16);
+    const brightness = (red * 299 + green * 587 + blue * 114) / 1000;
+    return brightness >= 140 ? "#111827" : "#ffffff";
+}
+
+export const MythicColorSwatchInput = ({color, label, onChange, inputWidth = "96px", sx = {}}) => {
+    const [pickerOpen, setPickerOpen] = React.useState(false);
+    const swatchRef = React.useRef(null);
+    const safeColor = isValidHexColor(color) ? color : "#000000";
+    return (
+        <ClickAwayListener onClickAway={() => setPickerOpen(false)}>
+            <Box sx={{display: "flex", alignItems: "center", gap: 1, minWidth: 0, position: "relative", ...sx}}>
+                <Box
+                    component="button"
+                    type="button"
+                    ref={swatchRef}
+                    onClick={(evt) => {
+                        evt.preventDefault();
+                        evt.stopPropagation();
+                        setPickerOpen((open) => !open);
+                    }}
+                    aria-label={label}
+                    aria-expanded={pickerOpen}
+                    sx={{
+                        alignItems: "center",
+                        backgroundColor: "transparent",
+                        border: "1px solid",
+                        borderColor: "divider",
+                        borderRadius: "4px",
+                        cursor: "pointer",
+                        display: "inline-flex",
+                        flex: "0 0 auto",
+                        height: 30,
+                        justifyContent: "center",
+                        p: "2px",
+                        width: 34,
+                    }}
+                >
+                    <Box
+                        sx={{
+                            backgroundColor: safeColor,
+                            borderRadius: "3px",
+                            height: "100%",
+                            width: "100%",
+                        }}
+                    />
+                </Box>
+                <Popper
+                    open={pickerOpen}
+                    anchorEl={swatchRef.current}
+                    placement="bottom-start"
+                    style={{zIndex: 100000}}
+                >
+                    <Box
+                        onMouseDown={(evt) => evt.stopPropagation()}
+                        onClick={(evt) => evt.stopPropagation()}
+                        sx={{
+                            backgroundColor: "background.paper",
+                            border: "1px solid",
+                            borderColor: "divider",
+                            borderRadius: "6px",
+                            boxShadow: 8,
+                            mt: 0.5,
+                            p: 1,
+                            "& .react-colorful": {
+                                width: 210,
+                                height: 160,
+                            },
+                        }}
+                    >
+                        <HexColorPicker color={safeColor} onChange={onChange} />
+                    </Box>
+                </Popper>
+                <HexColorInput
+                    color={color}
+                    onChange={onChange}
+                    prefixed={true}
+                    style={{
+                        width: inputWidth,
+                        minWidth: 0,
+                        height: "30px",
+                        boxSizing: "border-box",
+                        borderRadius: "4px",
+                        border: "1px solid rgba(128,128,128,0.45)",
+                        background: "transparent",
+                        color: "inherit",
+                        padding: "0 8px",
+                        fontFamily: "inherit",
+                        fontSize: "0.85rem",
+                    }}
+                />
+            </Box>
+        </ClickAwayListener>
+    );
+}

MythicReactUI/src/components/MythicComponents/MythicConfirmDialog.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import DialogTitle from '@mui/material/DialogTitle';
+import {MythicDialog} from './MythicDialog';
+import DialogContentText from '@mui/material/DialogContentText';
+import DialogContent from '@mui/material/DialogContent';
+import {MythicDialogButton, MythicDialogFooter} from "./MythicDialogLayout";
+
+export function MythicConfirmDialog(props) {
+    const handleSubmit = () => {
+        props.onSubmit();
+        if(props.dontCloseOnSubmit){
+            return;
+        }
+        props.onClose();
+    }
+    const acceptIntent = props.acceptColor === "success" ? "primary" :
+        props.acceptColor === "warning" ? "warning" :
+        props.acceptColor === "info" ? "info" :
+        "destructive";
+
+  return (
+    <MythicDialog fullWidth={false} maxWidth="sm" open={props.open} onClose={()=>{props.onClose()}} innerDialog={
+        <React.Fragment>
+            <DialogTitle >{props.title ? (props.title) : ("Are you sure?")}</DialogTitle>
+            {props.dialogText === undefined ? null : (
+              <DialogContent dividers={true} style={{maxHeight: "calc(70vh)"}}>
+                <DialogContentText>
+                  {props.dialogText}
+                </DialogContentText>
+              </DialogContent>
+            )}
+            <MythicDialogFooter>
+              <MythicDialogButton onClick={props.onClose}>
+                {props.cancelText ? (props.cancelText) : ("Cancel")}
+              </MythicDialogButton>
+              <MythicDialogButton onClick={handleSubmit} autoFocus intent={acceptIntent}>
+                {props.acceptText ? (props.acceptText) : ("Remove")}
+              </MythicDialogButton>
+            </MythicDialogFooter>
+        </React.Fragment>
+  } />
+  );
+}

MythicReactUI/src/components/MythicComponents/MythicDialog.js

@@ -0,0 +1,628 @@
+import {MythicActionButton} from "./MythicActionButton";
+import React, {useEffect} from 'react';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import Table from '@mui/material/Table';
+import TableBody from '@mui/material/TableBody';
+import TableCell from '@mui/material/TableCell';
+import TableContainer from '@mui/material/TableContainer';
+import TableHead from '@mui/material/TableHead';
+import TableRow from '@mui/material/TableRow';
+import Paper from '@mui/material/Paper';
+import { toLocalTime } from '../utilities/Time';
+import AceEditor from 'react-ace';
+import "ace-builds/src-noconflict/mode-json";
+import "ace-builds/src-noconflict/theme-github";
+import "ace-builds/src-noconflict/theme-monokai";
+import "ace-builds/src-noconflict/ext-searchbox";
+import {useTheme} from '@mui/material/styles';
+import WrapTextIcon from '@mui/icons-material/WrapText';
+import {MythicStyledTooltip} from "./MythicStyledTooltip";
+import Draggable from 'react-draggable';
+import {MythicDraggableDialogTitle} from "./MythicDraggableDialogTitle";
+import {MythicDialogButton, MythicDialogFooter} from "./MythicDialogLayout";
+import {MythicChip} from "./MythicChip";
+
+let mythicDialogIdCounter = 0;
+let mythicDialogStack = [];
+
+const MythicDraggableDialogPaper = React.forwardRef(function MythicDraggableDialogPaper(props, ref) {
+    const {
+        draggableCancel,
+        draggableHandle,
+        draggableOnStart,
+        draggableOnStop,
+        ...paperProps
+    } = props;
+    const nodeRef = React.useRef(null);
+    const setPaperRef = React.useCallback((node) => {
+        nodeRef.current = node;
+        if(typeof ref === "function"){
+            ref(node);
+        } else if(ref){
+            ref.current = node;
+        }
+    }, [ref]);
+    const onStart = React.useCallback((event, data) => {
+        return draggableOnStart?.(event, data, nodeRef.current);
+    }, [draggableOnStart]);
+    return (
+        <Draggable
+            nodeRef={nodeRef}
+            handle={draggableHandle}
+            cancel={draggableCancel}
+            onStart={onStart}
+            onStop={draggableOnStop}
+        >
+            <Paper {...paperProps} ref={setPaperRef} />
+        </Draggable>
+    );
+});
+
+// Kept temporarily for route-level compatibility while consumers migrate to the lightweight base module.
+// eslint-disable-next-line no-unused-vars
+function LegacyMythicDialog(props) {
+    const theme = useTheme();
+    const dialogIdRef = React.useRef(null);
+    if(dialogIdRef.current === null){
+        dialogIdRef.current = mythicDialogIdCounter++;
+    }
+    const [draggedState, setDraggedState] = React.useState({
+        style: {},
+        paperStyle: {
+            margin: "0",
+            height: "fit-content",
+            width: "stretch"
+        },
+        containerStyle: {
+
+        },
+        hideBackdrop: false,
+        modified: false
+    });
+    const descriptionElementRef = React.useRef(null);
+    React.useEffect(() => {
+        if(!props.open){
+            return undefined;
+        }
+        mythicDialogStack = mythicDialogStack.filter((id) => id !== dialogIdRef.current);
+        mythicDialogStack.push(dialogIdRef.current);
+        return () => {
+            mythicDialogStack = mythicDialogStack.filter((id) => id !== dialogIdRef.current);
+        };
+    }, [props.open]);
+    const isTopDialog = () => {
+        return mythicDialogStack[mythicDialogStack.length - 1] === dialogIdRef.current;
+    };
+    React.useEffect(() => {
+    if (props.open) {
+      const { current: descriptionElement } = descriptionElementRef;
+      if (descriptionElement !== null) {
+        descriptionElement.focus();
+      }
+    }
+  }, [props.open]);
+    const dialogOnClick = (e) => {
+        if(e.target.classList?.contains("MuiDialog-container")){
+            e.stopPropagation();
+            if(!isTopDialog()){
+                return;
+            }
+            if(draggedState.hideBackdrop){
+                props.onClose?.();
+            }
+        }
+    }
+    const dialogOnContextMenu = (e) => {
+        e.stopPropagation();
+    }
+    const handleOnClose = (event, reason) => {
+        if(reason === "backdropClick" || reason === "escapeKeyDown"){
+            event?.stopPropagation?.();
+            if(!isTopDialog()){
+                return;
+            }
+        }
+        if(reason === "backdropClick" && draggedState.hideBackdrop){
+            return;
+        }
+        props.onClose?.();
+    }
+    const onStart = React.useCallback((e, _data, paperNode) => {
+        if(e){
+            e.stopPropagation();
+            e.preventDefault();
+        }
+        setDraggedState((currentState) => {
+            if(currentState.modified){
+                return currentState;
+            }
+            const dragTarget = paperNode || e?.target?.closest?.(".MuiPaper-root") || e?.target?.offsetParent;
+            const targetWidth = dragTarget?.offsetWidth || e?.target?.offsetParent?.offsetWidth || 0;
+            return {
+                style: {},
+                paperStyle: {
+                    ...(targetWidth > 0 ? {width: targetWidth + "px"} : {}),
+                    margin: 0,
+                    overflowY: "auto",
+                },
+                containerStyle: {
+                    overflow: "visible",
+                },
+                hideBackdrop: true,
+                modified: true,
+            };
+        });
+    }, []);
+    const onStop = React.useCallback((e) => {
+        if(e){
+            e.stopPropagation();
+            e.preventDefault();
+        }
+    }, []);
+  return (
+          <Dialog
+            open={props.open}
+            onClose={handleOnClose}
+            scroll="paper"
+            maxWidth={props.maxWidth}
+            fullWidth={true}
+            PaperComponent={MythicDraggableDialogPaper}
+            PaperProps={{
+                draggableHandle: "#mythic-draggable-title",
+                draggableCancel: '[class*="MuiDialogContent-root"]',
+                draggableOnStart: onStart,
+                draggableOnStop: onStop,
+            }}
+            style={{...props.style, ...draggedState.style}}
+            disableEnforceFocus={true}
+            disablePortal={false}
+            hideBackdrop={draggedState.hideBackdrop}
+            aria-labelledby="scroll-dialog-title"
+            aria-describedby="scroll-dialog-description"
+            sx={{
+                ".MuiPaper-root": {
+                    borderRadius: "8px",
+                    backgroundColor: theme.palette.background.paper,
+                    border: `1px solid ${theme.borderColor}`,
+                    ...draggedState.paperStyle
+                },
+                ".MuiDialog-container": {
+                    ...draggedState.containerStyle
+                }
+            }}
+            onMouseDown={dialogOnClick}
+            onContextMenu={dialogOnContextMenu}
+          >
+            {props.innerDialog}
+          </Dialog>
+  );
+}
+
+export {MythicDialog} from "./MythicDialogBase";
+
+export function MythicModifyStringDialog(props) {
+  const [comment, setComment] = React.useState("");
+  const [wrap, setWrap] = React.useState(props.wrap ? props.wrap : false);
+  const theme = useTheme();
+    const onCommitSubmit = () => {
+        props.onSubmit(comment);
+        if(props.dontCloseOnSubmit){
+            return;
+        }
+        props.onClose();
+    }
+    const onChange = (value) => {
+        setComment(value);
+    }
+    useEffect( () => {
+        try{
+            setComment(JSON.stringify(JSON.parse(props.value), null, 2));
+        }catch(error){
+            setComment(props.value);
+        }
+
+    }, [props.value]);
+  return (
+    <React.Fragment>
+        {props.title !== "" &&
+            <MythicDraggableDialogTitle>{props.title}
+                <MythicStyledTooltip title={wrap ? "Toggle off word wrap" : "Toggl on word wrap"}
+                tooltipStyle={{float: "right"}}>
+                    <MythicActionButton iconOnly onClick={() => {setWrap(!wrap)}}>
+                        <WrapTextIcon color={wrap ? "success" : "secondary"} />
+                    </MythicActionButton>
+                </MythicStyledTooltip>
+            </MythicDraggableDialogTitle>
+        }
+        <DialogContent dividers={true} style={{ margin: 0, padding: 0}}>
+            <AceEditor
+                mode="json"
+                theme={theme.palette.mode === 'dark' ? 'monokai' : 'github'}
+                width="100%"
+                fontSize={14}
+                showPrintMargin={false}
+                wrapEnabled={wrap}
+                value={comment}
+                focus={true}
+                onChange={onChange}
+                setOptions={{
+                    tabSize: 4,
+                    useWorker: false,
+                    showInvisibles: false,
+                }}
+            />
+        </DialogContent>
+        { (props.onClose || props.onSubmit) &&
+            <MythicDialogFooter>
+                {props.onClose &&
+                    <MythicDialogButton onClick={props.onClose}>
+                        Close
+                    </MythicDialogButton>
+                }
+                {props.onSubmit &&
+                    <MythicDialogButton intent="primary" onClick={onCommitSubmit}>
+                        {props.onSubmitText ? props.onSubmitText : "Submit"}
+                    </MythicDialogButton>
+                }
+            </MythicDialogFooter>
+        }
+    </React.Fragment>
+  );
+}
+
+const isPlainObject = (value) => {
+  return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+
+const parseJSONDialogValue = (value) => {
+  if(value === undefined || value === null){
+    return value;
+  }
+  if(typeof value !== "string"){
+    return value;
+  }
+  try{
+    return JSON.parse(value);
+  }catch(error){
+    return value;
+  }
+}
+
+const getJSONValueType = (value) => {
+  if(value === null){return "null"}
+  if(value === undefined){return "empty"}
+  if(Array.isArray(value)){return "array"}
+  if(isPlainObject(value)){return "object"}
+  return typeof value;
+}
+
+const getJSONValueCount = (value) => {
+  if(Array.isArray(value)){return value.length}
+  if(isPlainObject(value)){return Object.keys(value).length}
+  if(value === undefined || value === null || value === ""){return 0}
+  return 1;
+}
+
+const getArrayObjectHeaders = (rows) => {
+  const headers = [];
+  rows.forEach((row) => {
+    if(!isPlainObject(row)){return}
+    Object.keys(row).forEach((key) => {
+      if(!headers.includes(key)){
+        headers.push(key);
+      }
+    });
+  });
+  return headers;
+}
+
+const JSONTypeBadge = ({value}) => {
+  const type = getJSONValueType(value);
+  const count = getJSONValueCount(value);
+  const label = type === "array" ? `${count} item${count === 1 ? "" : "s"}` :
+      type === "object" ? `${count} field${count === 1 ? "" : "s"}` :
+      type;
+  return <MythicChip compact label={label} tone={["array", "object"].includes(type) ? "info" : "neutral"} />;
+}
+
+const JSONPrimitiveValue = ({name, value, me}) => {
+  const type = getJSONValueType(value);
+  if(type === "null" || type === "empty" || value === ""){
+    return <span className="mythic-json-value-empty text-xs text-disabled">None</span>
+  }
+  if(type === "boolean"){
+    return <MythicChip compact label={value ? "True" : "False"} tone={value ? "success" : "warning"} />;
+  }
+  return <span className="mythic-json-value-primitive text-primary text-xs leading-135 wrap-anywhere">{convertValueToContextValue(name, value, me)}</span>
+}
+
+const JSONTableCellValue = ({name, value, me, depth}) => {
+  if(Array.isArray(value) || isPlainObject(value)){
+    return (
+      <JSONTableValue
+        label={name}
+        value={value}
+        me={me}
+        depth={depth + 1}
+      />
+    );
+  }
+  return <JSONPrimitiveValue name={name} value={value} me={me} />;
+}
+
+const JSONTableValue = ({label, value, me, depth=0, leftColumn="Name", rightColumn="Value"}) => {
+  const type = getJSONValueType(value);
+  const showPanelHeader = Boolean(label) && depth === 0;
+  if(type !== "array" && type !== "object"){
+    return <JSONPrimitiveValue name={label || ""} value={value} me={me} />;
+  }
+  if(type === "object"){
+    const entries = Object.entries(value);
+    return (
+      <div className={`mythic-json-panel p-4 flex flex-column gap-4 rounded bg-neutral-1 border-subtle${depth === 0 ? " mythic-json-panel-root bg-surface-muted" : ""} min-w-0`}>
+        {showPanelHeader &&
+          <div className="mythic-json-panel-header items-center flex flex-wrap gap-4 justify-between min-w-0">
+            <span className="mythic-json-panel-title text-xs font-800 leading-125 min-w-0 wrap-anywhere text-primary">{label}</span>
+            <JSONTypeBadge value={value} />
+          </div>
+        }
+        {entries.length === 0 ? (
+          <div className="mythic-json-empty-state text-xs text-muted">No fields to display.</div>
+        ) : (
+          <TableContainer className="mythic-json-table-wrap overflow-auto rounded border-subtle">
+            <Table size="small" stickyHeader={depth === 0} style={{tableLayout: "fixed"}}>
+              <TableHead>
+                <TableRow>
+                  <TableCell style={{width: depth === 0 ? "14rem" : "12rem"}}>{leftColumn}</TableCell>
+                  <TableCell>{rightColumn}</TableCell>
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {entries.map(([key, entryValue]) => (
+                  <TableRow key={`${depth}-${key}`} hover>
+                    <TableCell className="mythic-json-key-cell">
+                      <div className="mythic-json-key-stack flex flex-column gap-2 min-w-0">
+                        <span className="mythic-json-key text-xs font-800 leading-125 wrap-anywhere text-primary">{key}</span>
+                        <JSONTypeBadge value={entryValue} />
+                      </div>
+                    </TableCell>
+                    <TableCell className="mythic-json-value-cell text-primary text-xs leading-135 wrap-anywhere">
+                      <JSONTableCellValue name={key} value={entryValue} me={me} depth={depth} />
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          </TableContainer>
+        )}
+      </div>
+    );
+  }
+  const objectHeaders = getArrayObjectHeaders(value);
+  const isObjectArray = value.length > 0 && objectHeaders.length > 0 && value.every((row) => isPlainObject(row));
+  return (
+    <div className={`mythic-json-panel p-4 flex flex-column gap-4 rounded bg-neutral-1 border-subtle${depth === 0 ? " mythic-json-panel-root bg-surface-muted" : ""} min-w-0`}>
+      {showPanelHeader &&
+        <div className="mythic-json-panel-header items-center flex flex-wrap gap-4 justify-between min-w-0">
+          <span className="mythic-json-panel-title text-xs font-800 leading-125 min-w-0 wrap-anywhere text-primary">{label}</span>
+          <JSONTypeBadge value={value} />
+        </div>
+      }
+      {value.length === 0 ? (
+        <div className="mythic-json-empty-state text-xs text-muted">No items to display.</div>
+      ) : isObjectArray ? (
+        <TableContainer className="mythic-json-table-wrap overflow-auto rounded border-subtle">
+          <Table size="small" stickyHeader={depth === 0} style={{tableLayout: "fixed", minWidth: `${Math.max(38, objectHeaders.length * 12)}rem`}}>
+            <TableHead>
+              <TableRow>
+                <TableCell style={{width: "4rem"}}>#</TableCell>
+                {objectHeaders.map((header) => (
+                  <TableCell key={`array-header-${header}`} style={{width: "12rem"}}>{header}</TableCell>
+                ))}
+              </TableRow>
+            </TableHead>
+            <TableBody>
+              {value.map((row, rowIndex) => (
+                <TableRow key={`array-row-${rowIndex}`} hover>
+                  <TableCell className="mythic-json-index-cell text-xs font-800 text-muted text-right">{rowIndex + 1}</TableCell>
+                  {objectHeaders.map((header) => (
+                    <TableCell key={`array-row-${rowIndex}-${header}`} className="mythic-json-value-cell text-primary text-xs leading-135 wrap-anywhere">
+                      <JSONTableCellValue name={header} value={row[header]} me={me} depth={depth} />
+                    </TableCell>
+                  ))}
+                </TableRow>
+              ))}
+            </TableBody>
+          </Table>
+        </TableContainer>
+      ) : (
+        <TableContainer className="mythic-json-table-wrap overflow-auto rounded border-subtle">
+          <Table size="small" stickyHeader={depth === 0} style={{tableLayout: "fixed"}}>
+            <TableHead>
+              <TableRow>
+                <TableCell style={{width: "4rem"}}>#</TableCell>
+                <TableCell>Value</TableCell>
+              </TableRow>
+            </TableHead>
+            <TableBody>
+              {value.map((entryValue, rowIndex) => (
+                <TableRow key={`array-value-row-${rowIndex}`} hover>
+                  <TableCell className="mythic-json-index-cell text-xs font-800 text-muted text-right">{rowIndex + 1}</TableCell>
+                  <TableCell className="mythic-json-value-cell text-primary text-xs leading-135 wrap-anywhere">
+                    <JSONTableCellValue name={`${label || "value"} ${rowIndex + 1}`} value={entryValue} me={me} depth={depth} />
+                  </TableCell>
+                </TableRow>
+              ))}
+            </TableBody>
+          </Table>
+        </TableContainer>
+      )}
+    </div>
+  );
+}
+
+export function MythicViewJSONAsTableDialog(props) {
+  const parsedValue = React.useMemo(() => parseJSONDialogValue(props.value), [props.value]);
+  const rootLabel = props.title || "JSON Data";
+  return (
+    <React.Fragment>
+        <MythicDraggableDialogTitle style={{wordBreak: "break-all", maxWidth: "100%"}}>
+          <div className="mythic-json-title-row items-center flex flex-wrap gap-4 justify-between min-w-0 w-full">
+            <span>{rootLabel}</span>
+            <JSONTypeBadge value={parsedValue} />
+          </div>
+        </MythicDraggableDialogTitle>
+        <DialogContent dividers={true} className="mythic-dialog-body flex flex-column gap-6 mythic-json-dialog-body min-w-0 w-full overflow-auto">
+          <JSONTableValue
+            value={parsedValue}
+            me={props.me}
+            leftColumn={props.leftColumn || "Name"}
+            rightColumn={props.rightColumn || "Value"}
+          />
+        </DialogContent>
+        <MythicDialogFooter>
+          <MythicDialogButton onClick={props.onClose}>
+            Close
+          </MythicDialogButton>
+        </MythicDialogFooter>
+    </React.Fragment>
+  );
+}
+
+export function MythicViewObjectPropertiesAsTableDialog(props) {
+  const [comment, setComment] = React.useState([]);
+    useEffect( () => {
+        const permissions = props.keys.reduce( (prev, key) => {
+          if(props.value[key] !== undefined && props.value[key] !== null && props.value[key] !== ""){
+            return [...prev, {"name": key, "value": props.value[key]}]
+          }
+          else{
+            return [...prev];
+          }
+        }, []);
+
+      setComment(permissions);
+    }, [props.value, props.keys]);
+  return (
+    <React.Fragment>
+        <DialogTitle id="form-dialog-title">{props.title}</DialogTitle>
+        <DialogContent dividers={true}>
+        <Paper elevation={5} style={{position: "relative"}} variant={"elevation"}>
+          <TableContainer component={Paper}>
+            <Table size="small" style={{"tableLayout": "fixed", "maxWidth": "calc(100vw)", "overflow": "scroll"}}>
+                  <TableHead>
+                      <TableRow>
+                          <TableCell>{props.leftColumn}</TableCell>
+                          <TableCell>{props.rightColumn}</TableCell>
+                      </TableRow>
+                  </TableHead>
+                  <TableBody>
+                    {comment.map( (element, index) => (
+                      <TableRow key={'row' + index}>
+                        <TableCell style={{wordBreak: "break-all"}}>{element.name}</TableCell>
+                        <TableCell style={{wordBreak: "break-all"}}>{convertValueToContextValue(element.name, element.value)}</TableCell>
+                      </TableRow>
+                    ))}
+                  </TableBody>
+              </Table>
+            </TableContainer>
+        </Paper>
+        </DialogContent>
+        <MythicDialogFooter>
+          <MythicDialogButton onClick={props.onClose}>
+            Close
+          </MythicDialogButton>
+        </MythicDialogFooter>
+    </React.Fragment>
+  );
+}
+const convertValueToContextValue = (key, value, me) => {
+  const keyText = String(key || "").toLowerCase();
+  if(value === undefined || value === null){
+      return "";
+  }
+  if( keyText.includes("time") ){
+    try{
+        return TableRowDateCell({cellData: value, view_utc_time: me?.user?.view_utc_time})
+    }catch(error){
+        console.log("failed to parse metadata as date", key, value);
+        return value;
+    }
+  } else if( keyText.includes("size") ){
+      try{
+          return TableRowSizeCell({cellData: value})
+      }catch(error){
+          console.log("failed to parse metadata as size", key, value);
+          return value;
+      }
+  } else if (isPlainObject(value)) {
+    return JSON.stringify(value, null, 2);
+  } else if (Array.isArray(value)){
+    return JSON.stringify(value, null, 2);
+  } else if (value === true) {
+    return "True";
+  } else if (value === false) {
+    return "False";
+  } else {
+      return value;
+  }
+}
+export const TableRowDateCell = ({ cellData, rowData, view_utc_time=true }) => {
+
+    try{
+        let cellDataInt = parseInt(cellData)
+        if(cellData === "" || cellData === undefined || cellDataInt <= 0){
+            return "";
+        }
+        let view_utc = true;
+        if(view_utc_time !== undefined){
+            view_utc = view_utc_time
+        }
+        // handle Unix epoch timestamps
+        if (view_utc) {
+            let init_date = new Date(cellDataInt);
+            return init_date.toDateString() + " " + init_date.toTimeString().substring(0, 8) + " UTC";
+        } else {
+            let timezoneDate = new Date(cellDataInt);
+            timezoneDate.setTime(timezoneDate.getTime() - (timezoneDate.getTimezoneOffset() *60*1000));
+            return timezoneDate.toLocaleDateString() + " " + timezoneDate.toLocaleString([], {hour12: true, hour: "2-digit", minute: "2-digit"});
+        }
+        //const dateData = new Date(cellDataInt).toISOString();
+        //return toLocalTime(dateData.slice(0, 10) + " " + dateData.slice(11,-1), view_utc_time);
+    }catch(error){
+        try{
+            let cellDataInt = parseInt(cellData)
+            // handle windows FILETIME values
+            const dateData = new Date( ((cellDataInt / 10000000) - 11644473600) * 1000).toISOString();
+            return toLocalTime(dateData.slice(0, 10) + " " + dateData.slice(11,-1), view_utc_time);
+        }catch(error2){
+            console.log("error with timestamp: ", cellData);
+            return String(cellData);
+        }
+
+    }
+  
+};
+export const TableRowSizeCell = ({ cellData, rowData }) => {
+  const getStringSize = () => {
+      try {
+          // process for getting human readable string from bytes: https://stackoverflow.com/a/18650828
+          let bytes = parseInt(cellData);
+          if (cellData === '' || cellData === undefined) return '';
+          if (bytes === 0) return '0 B';
+          const decimals = 2;
+          const k = 1024;
+          const dm = decimals < 0 ? 0 : decimals;
+          const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+
+          const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+          return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
+      } catch (error) {
+          return cellData;
+      }
+  };
+  return getStringSize(cellData);
+};

MythicReactUI/src/components/MythicComponents/MythicDialogBase.js

@@ -0,0 +1,111 @@
+import React from "react";
+import Dialog from "@mui/material/Dialog";
+import Paper from "@mui/material/Paper";
+import Draggable from "react-draggable";
+import {useTheme} from "@mui/material/styles";
+
+let mythicDialogIdCounter = 0;
+let mythicDialogStack = [];
+
+const MythicDraggableDialogPaper = React.forwardRef(function MythicDraggableDialogPaper(props, ref) {
+  const {draggableCancel, draggableHandle, draggableOnStart, draggableOnStop, ...paperProps} = props;
+  const nodeRef = React.useRef(null);
+  const setPaperRef = React.useCallback((node) => {
+    nodeRef.current = node;
+    if(typeof ref === "function"){
+      ref(node);
+    }else if(ref){
+      ref.current = node;
+    }
+  }, [ref]);
+  const onStart = React.useCallback((event, data) => {
+    return draggableOnStart?.(event, data, nodeRef.current);
+  }, [draggableOnStart]);
+  return (
+    <Draggable nodeRef={nodeRef} handle={draggableHandle} cancel={draggableCancel}
+               onStart={onStart} onStop={draggableOnStop}>
+      <Paper {...paperProps} ref={setPaperRef} />
+    </Draggable>
+  );
+});
+
+export function MythicDialog(props) {
+  const theme = useTheme();
+  const dialogIdRef = React.useRef(null);
+  if(dialogIdRef.current === null){
+    dialogIdRef.current = mythicDialogIdCounter++;
+  }
+  const [draggedState, setDraggedState] = React.useState({
+    style: {},
+    paperStyle: {margin: "0", height: "fit-content", width: "stretch"},
+    containerStyle: {},
+    hideBackdrop: false,
+    modified: false,
+  });
+  const descriptionElementRef = React.useRef(null);
+  React.useEffect(() => {
+    if(!props.open){return undefined;}
+    mythicDialogStack = mythicDialogStack.filter((id) => id !== dialogIdRef.current);
+    mythicDialogStack.push(dialogIdRef.current);
+    return () => {
+      mythicDialogStack = mythicDialogStack.filter((id) => id !== dialogIdRef.current);
+    };
+  }, [props.open]);
+  const isTopDialog = () => mythicDialogStack[mythicDialogStack.length - 1] === dialogIdRef.current;
+  React.useEffect(() => {
+    if(props.open && descriptionElementRef.current !== null){
+      descriptionElementRef.current.focus();
+    }
+  }, [props.open]);
+  const dialogOnClick = (event) => {
+    if(event.target.classList?.contains("MuiDialog-container")){
+      event.stopPropagation();
+      if(isTopDialog() && draggedState.hideBackdrop){
+        props.onClose?.();
+      }
+    }
+  };
+  const handleOnClose = (event, reason) => {
+    if(reason === "backdropClick" || reason === "escapeKeyDown"){
+      event?.stopPropagation?.();
+      if(!isTopDialog()){return;}
+    }
+    if(reason === "backdropClick" && draggedState.hideBackdrop){return;}
+    props.onClose?.();
+  };
+  const onStart = React.useCallback((event, _data, paperNode) => {
+    event?.stopPropagation?.();
+    event?.preventDefault?.();
+    setDraggedState((currentState) => {
+      if(currentState.modified){return currentState;}
+      const dragTarget = paperNode || event?.target?.closest?.(".MuiPaper-root") || event?.target?.offsetParent;
+      const targetWidth = dragTarget?.offsetWidth || event?.target?.offsetParent?.offsetWidth || 0;
+      return {
+        style: {},
+        paperStyle: {...(targetWidth > 0 ? {width: `${targetWidth}px`} : {}), margin: 0, overflowY: "auto"},
+        containerStyle: {overflow: "visible"},
+        hideBackdrop: true,
+        modified: true,
+      };
+    });
+  }, []);
+  const onStop = React.useCallback((event) => {
+    event?.stopPropagation?.();
+    event?.preventDefault?.();
+  }, []);
+  return (
+    <Dialog open={props.open} onClose={handleOnClose} scroll="paper" maxWidth={props.maxWidth} fullWidth={true}
+            PaperComponent={MythicDraggableDialogPaper}
+            PaperProps={{draggableHandle: "#mythic-draggable-title", draggableCancel: '[class*="MuiDialogContent-root"]', draggableOnStart: onStart, draggableOnStop: onStop}}
+            style={{...props.style, ...draggedState.style}} disableEnforceFocus={true} disablePortal={false}
+            hideBackdrop={draggedState.hideBackdrop} aria-labelledby="scroll-dialog-title"
+            aria-describedby="scroll-dialog-description"
+            sx={{
+              ".MuiPaper-root": {borderRadius: "8px", backgroundColor: theme.palette.background.paper, border: `1px solid ${theme.borderColor}`, ...draggedState.paperStyle},
+              ".MuiDialog-container": {...draggedState.containerStyle},
+            }}
+            onMouseDown={dialogOnClick} onContextMenu={(event) => event.stopPropagation()}>
+      {props.innerDialog}
+    </Dialog>
+  );
+}

MythicReactUI/src/components/MythicComponents/MythicDialogLayout.js

@@ -0,0 +1,171 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import {MythicActionButton} from './MythicActionButton';
+import DialogActions from '@mui/material/DialogActions';
+import Typography from '@mui/material/Typography';
+
+const joinClasses = (...classes) => classes.filter(Boolean).join(" ");
+
+export function MythicDialogBody({children, className, compact = false, ...props}) {
+    return (
+        <Box
+            className={joinClasses("mythic-dialog-body flex flex-column gap-6 min-w-0 w-full", compact && "mythic-dialog-body-compact gap-4", className)}
+            {...props}
+        >
+            {children}
+        </Box>
+    );
+}
+
+export function MythicDialogSection({title, description, actions, children, className, ...props}) {
+    return (
+        <Box component="section" className={joinClasses("mythic-dialog-section bg-surface-muted border-subtle min-w-0 rounded", className)} {...props}>
+            {(title || description || actions) &&
+                <Box className="mythic-dialog-section-header items-start flex gap-6 justify-between min-w-0">
+                    <Box sx={{minWidth: 0}}>
+                        {title &&
+                            <Typography component="h3" className="mythic-dialog-section-title text-sm font-700 leading-125 text-primary">
+                                {title}
+                            </Typography>
+                        }
+                        {description &&
+                            <Typography component="div" className="mythic-dialog-section-description">
+                                {description}
+                            </Typography>
+                        }
+                    </Box>
+                    {actions &&
+                        <Box className="mythic-dialog-section-actions items-center flex flex-none gap-3">
+                            {actions}
+                        </Box>
+                    }
+                </Box>
+            }
+            {children}
+        </Box>
+    );
+}
+
+export function MythicDialogGrid({children, className, minWidth = "16rem", sx = {}, ...props}) {
+    return (
+        <Box
+            className={joinClasses("mythic-dialog-grid items-logical-start gap-5 min-w-0 w-full grid", className)}
+            sx={{"--mythic-dialog-grid-min": minWidth, ...sx}}
+            {...props}
+        >
+            {children}
+        </Box>
+    );
+}
+
+export function MythicDialogChoiceRow({children, className, ...props}) {
+    return (
+        <Box className={joinClasses("mythic-dialog-choice-row items-center gap-4 w-full grid", className)} {...props}>
+            {children}
+        </Box>
+    );
+}
+
+export function MythicDialogChoiceDivider({children = "OR", className, ...props}) {
+    return (
+        <Box component="span" className={joinClasses("mythic-dialog-choice-divider text-xs font-700 text-muted text-center", className)} {...props}>
+            {children}
+        </Box>
+    );
+}
+
+export function MythicDialogFooter({children, className, ...props}) {
+    return (
+        <DialogActions className={className} {...props}>
+            {children}
+        </DialogActions>
+    );
+}
+
+export function MythicDialogButton({children, className, intent = "secondary", ...props}) {
+    const tone = intent === "destructive" ? "error" : intent;
+    return (
+        <MythicActionButton
+            className={joinClasses("mythic-dialog-button", className)}
+            colorMode="always"
+            size="small"
+            tone={tone}
+            variant="contained"
+            {...props}
+        >
+            {children}
+        </MythicActionButton>
+    );
+}
+
+export function MythicForm({children, className, ...props}) {
+    return (
+        <Box component="form" className={joinClasses("mythic-form flex flex-column gap-6 min-w-0 w-full", className)} {...props}>
+            {children}
+        </Box>
+    );
+}
+
+export function MythicFormGrid({children, className, minWidth = "16rem", sx = {}, ...props}) {
+    return (
+        <Box
+            className={joinClasses("mythic-form-grid items-logical-start gap-6 min-w-0 w-full grid", className)}
+            sx={{"--mythic-form-grid-min": minWidth, ...sx}}
+            {...props}
+        >
+            {children}
+        </Box>
+    );
+}
+
+export function MythicFormField({children, className, description, label, required = false, ...props}) {
+    return (
+        <Box className={joinClasses("mythic-form-field flex flex-column gap-3 min-w-0", className)} {...props}>
+            {(label || description) &&
+                <Box className="mythic-form-field-copy min-w-0">
+                    {label &&
+                        <Typography component="label" className="mythic-form-field-label text-xs font-750 leading-125 text-primary">
+                            {label}{required && <Box component="span" className="mythic-form-field-required"> *</Box>}
+                        </Typography>
+                    }
+                    {description &&
+                        <Typography component="div" className="mythic-form-field-description">
+                            {description}
+                        </Typography>
+                    }
+                </Box>
+            }
+            <Box className="mythic-form-field-control min-w-0 w-full">
+                {children}
+            </Box>
+        </Box>
+    );
+}
+
+export function MythicFormNote({children, className, ...props}) {
+    return (
+        <Box className={joinClasses("mythic-form-note text-xs leading-140 rounded bg-neutral-1 border-subtle text-muted", className)} {...props}>
+            {children}
+        </Box>
+    );
+}
+
+export function MythicFormSwitchRow({control, label, description, className, ...props}) {
+    return (
+        <Box className={joinClasses("mythic-form-switch-row py-5 px-6 items-center flex gap-6 justify-between min-w-0 w-full rounded bg-surface border-subtle", className)} {...props}>
+            <Box sx={{minWidth: 0}}>
+                <Typography component="div" className="mythic-form-field-label text-xs font-750 leading-125 text-primary">
+                    {label}
+                </Typography>
+                {description &&
+                    <Typography component="div" className="mythic-form-field-description">
+                        {description}
+                    </Typography>
+                }
+            </Box>
+            <Box className="mythic-form-switch-control flex-none">
+                {control}
+            </Box>
+        </Box>
+    );
+}

MythicReactUI/src/components/MythicComponents/MythicDisplayTextDialog.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import {MythicDialog, MythicModifyStringDialog} from './MythicDialog';
+
+export function MythicDisplayTextDialog(props) {
+  return (
+    <MythicDialog fullWidth={props.fullWidth === null ? false : props.fullWidth}
+                  maxWidth={props.maxWidth === null ? "sm" : props.maxWidth}
+                  open={props.open}
+                  onClose={()=>{props.onClose()}} innerDialog={
+            <MythicModifyStringDialog title={props.title}
+                                      onClose={props.onClose}
+                                      value={props.value}
+                                      maxRows={20} />
+  } />
+  );
+}

MythicReactUI/src/components/MythicComponents/MythicDraggableDialogTitle.js

@@ -0,0 +1,17 @@
+import DialogTitle from '@mui/material/DialogTitle';
+import {useTheme} from '@mui/material/styles';
+
+
+export const MythicDraggableDialogTitle = ({children}) => {
+    const theme = useTheme();
+    return (
+        <DialogTitle id="mythic-draggable-title" style={{
+            cursor: 'move',
+            width: "100%",
+            backgroundColor: theme.palette.background.paper,
+            color: theme.palette.text.primary,
+        }}>
+            {children}
+        </DialogTitle>
+    )
+}

MythicReactUI/src/components/MythicComponents/MythicDraggableList.js

@@ -0,0 +1,20 @@
+
+import {createPortal} from 'react-dom';
+
+export const reorder = (
+    list,
+    startIndex,
+    endIndex
+) => {
+    const result = Array.from(list);
+    const [removed] = result.splice(startIndex, 1);
+    result.splice(endIndex, 0, removed);
+    return result;
+};
+
+export const MythicDraggablePortal = ({children, isDragging}) => {
+    if(isDragging && typeof document !== "undefined"){
+        return createPortal(children, document.body);
+    }
+    return children;
+};

MythicReactUI/src/components/MythicComponents/MythicFeedbackDialog.js

@@ -0,0 +1,162 @@
+import React from 'react';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import FormControl from '@mui/material/FormControl';
+import MenuItem from '@mui/material/MenuItem';
+import Select from '@mui/material/Select';
+import TextField from '@mui/material/TextField';
+import {gql } from '@apollo/client';
+import {snackActions} from '../utilities/Snackbar';
+import {useMutation } from '@apollo/client';
+import {
+  MythicDialogBody,
+  MythicDialogButton,
+  MythicDialogFooter,
+  MythicDialogGrid,
+  MythicDialogSection,
+  MythicForm,
+  MythicFormField,
+  MythicFormNote
+} from './MythicDialogLayout';
+
+const submitFeedbackMutation = gql`
+  mutation submitFeedback($webhookType: String!, $webhookData: jsonb!){
+    sendExternalWebhook(webhook_type: $webhookType, webhook_data: $webhookData){
+      status
+      error
+    }
+  }
+`;
+export function MythicFeedbackDialog(props) {
+  const [message, setMessage] = React.useState("");
+  const [taskID, setTaskID] = React.useState("");
+  const messageTypeOptions = [
+    {display: "Bug", value: "bug", description: "Something is broken or behaving unexpectedly."},
+    {display: "Feature Request", value: "feature_request", description: "A workflow, capability, or quality-of-life improvement."},
+    {display: "Confusing UI", value: "confusing_ui", description: "A part of the interface is unclear or hard to use."},
+    {display: "Detection", value: "detection", description: "Detection, telemetry, or visibility feedback."},
+  ];
+  const [messageType, setMessageType] = React.useState("bug");
+  const [submitFeedback, {loading}] = useMutation(submitFeedbackMutation, {
+    update: (cache, {data}) => {
+      if(data.sendExternalWebhook.status === "success"){
+        snackActions.success("Submitted Feedback!");
+      } else {
+        snackActions.warning(data.sendExternalWebhook.error);
+      }
+      props.onClose();
+    },
+    onError: error => {
+      console.log(error)
+      snackActions.warning(error.message);
+    }
+  });
+  const handleSubmit = () => {
+      const trimmedMessage = message.trim();
+      if(trimmedMessage.length === 0){
+        snackActions.warning("Please include feedback before submitting.");
+        return;
+      }
+      let webhookData = {};
+      if(Number(taskID) > 0){
+        webhookData["task_display_id"] = String(Number(taskID));
+      }
+      webhookData["message"] =  trimmedMessage;
+      webhookData["feedback_type"] = messageType;
+      submitFeedback({variables: {webhookType: "new_feedback", webhookData: webhookData}});
+  }
+  const handleMessageTypeChange = (evt) => {
+    setMessageType(evt.target.value);
+  }
+  const handleTaskIDChange = (evt) => {
+    setTaskID(evt.target.value);
+  }
+  const handleMessageChange = (evt) => {
+    setMessage(evt.target.value);
+  }
+  const onSubmitForm = (event) => {
+    event.preventDefault();
+    handleSubmit();
+  }
+  const selectedMessageType = messageTypeOptions.find((opt) => opt.value === messageType);
+  const canSubmit = message.trim().length > 0 && !loading;
+  
+return (
+  <React.Fragment>
+      <DialogTitle>{props.title || "Submit Feedback"}</DialogTitle>
+      <DialogContent dividers={true}>
+        <MythicDialogBody>
+          <MythicDialogSection
+              title="Feedback Destination"
+              description="Send this report to the feedback webhook configured for the current operation."
+          >
+            <MythicFormNote>
+              Use this for bugs, workflow friction, feature ideas, detection notes, or anything operators should be able to capture without leaving Mythic.
+            </MythicFormNote>
+          </MythicDialogSection>
+          <MythicDialogSection
+              title="Report Details"
+              description="Capture the category, optional task context, and the feedback details."
+          >
+            <MythicForm onSubmit={onSubmitForm}>
+              <MythicDialogGrid minWidth="14rem">
+                <MythicFormField label="Feedback Type" description={selectedMessageType?.description} required>
+                  <FormControl fullWidth size="small">
+                    <Select
+                        labelId="feedback-type-select-label"
+                        id="feedback-type-select"
+                        value={messageType}
+                        onChange={handleMessageTypeChange}
+                    >
+                      {messageTypeOptions.map( (opt) => (
+                          <MenuItem value={opt.value} key={opt.value}>{opt.display}</MenuItem>
+                      ) )}
+                    </Select>
+                  </FormControl>
+                </MythicFormField>
+                <MythicFormField
+                    label="Task"
+                    description="Optional task display ID for feedback tied to specific output or tasking."
+                >
+                  <TextField
+                      fullWidth
+                      size="small"
+                      type="number"
+                      value={taskID}
+                      onChange={handleTaskIDChange}
+                      placeholder="Optional"
+                      inputProps={{min: 0}}
+                  />
+                </MythicFormField>
+              </MythicDialogGrid>
+              <MythicFormField
+                  label="Feedback"
+                  description="Include the context an operator or maintainer would need to understand the issue."
+                  required
+              >
+                <TextField
+                    autoFocus
+                    fullWidth
+                    multiline
+                    minRows={6}
+                    maxRows={10}
+                    value={message}
+                    onChange={handleMessageChange}
+                    placeholder="What happened, what did you expect, and what would make this easier?"
+                />
+              </MythicFormField>
+            </MythicForm>
+          </MythicDialogSection>
+        </MythicDialogBody>
+      </DialogContent>
+      <MythicDialogFooter>
+        <MythicDialogButton onClick={props.onClose}>
+          Close
+        </MythicDialogButton>
+        <MythicDialogButton onClick={handleSubmit} intent="primary" disabled={!canSubmit}>
+          {loading ? "Submitting..." : "Submit Feedback"}
+        </MythicDialogButton>
+      </MythicDialogFooter>
+</React.Fragment>
+  );
+}

MythicReactUI/src/components/MythicComponents/MythicFileBrowserVirtualTree.js

@@ -0,0 +1,483 @@
+import { alpha } from "@mui/material";
+import { styled } from '@mui/material/styles';
+import React, { useCallback, useMemo } from "react";
+import AutoSizer from "react-virtualized-auto-sizer";
+import { FixedSizeList as List } from "react-window";
+import {faFolderOpen, faFolder} from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import ComputerIcon from '@mui/icons-material/Computer';
+import DescriptionIcon from '@mui/icons-material/Description';
+import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';
+import ErrorIcon from '@mui/icons-material/Error';
+import { Typography } from '@mui/material';
+import { MythicStyledTooltip } from "./MythicStyledTooltip";
+import WidgetsIcon from '@mui/icons-material/Widgets';
+import { areEqual } from 'react-window';
+
+const PREFIX = 'FileBrowserVirtualTree';
+
+const classes = {
+  rowContainer: `${PREFIX}-rowContainer`,
+  row: `${PREFIX}-row`,
+  rowButtonWrapper: `${PREFIX}-rowButtonWrapper`,
+  rowButton: `${PREFIX}-rowButton`,
+  rowLabel: `${PREFIX}-rowLabel`,
+  heading: `${PREFIX}-heading`,
+  secondaryHeading: `${PREFIX}-secondaryHeading`,
+  taskAndTimeDisplay: `${PREFIX}-taskAndTimeDisplay`,
+  secondaryHeadingExpanded: `${PREFIX}-secondaryHeadingExpanded`,
+  icon: `${PREFIX}-icon`,
+  details: `${PREFIX}-details`,
+  column: `${PREFIX}-column`,
+  paper: `${PREFIX}-paper`,
+  table: `${PREFIX}-table`,
+  visuallyHidden: `${PREFIX}-visuallyHidden`
+};
+
+const StyledAutoSizer = styled(AutoSizer)((
+  {
+    theme
+  }
+) => ({
+  height: "100%",
+  minHeight: 0,
+  minWidth: 0,
+  overflow: "hidden",
+  width: "100%",
+
+  [`& .${classes.rowContainer}`]: {
+    cursor: "pointer",
+    overflow: "hidden",
+    transition: "background-color 120ms ease, color 120ms ease",
+  },
+
+  [`& .${classes.rowContainer}:hover`]: {
+    backgroundColor: theme.palette.action.hover,
+  },
+
+  [`& .${classes.row}`]: {
+    display: "flex",
+    alignItems: "center",
+    height: "100%",
+    minWidth: "fit-content",
+    paddingRight: theme.spacing(1),
+    userSelect: "none",
+    whiteSpace: "nowrap",
+    width: "100%",
+  },
+
+  [`& .${classes.row}[data-deleted="true"]`]: {
+    textDecoration: "line-through",
+  },
+
+  [`& .${classes.rowButtonWrapper}`]: {
+    alignSelf: "stretch",
+    borderLeft: `2px dashed ${alpha(theme.palette.text.primary, 0.34)}`,
+    flex: "0 0 14px",
+    marginLeft: 7,
+  },
+
+  [`& .${classes.rowButton}`]: {
+    alignItems: "center",
+    display: "inline-flex",
+    flex: "0 0 auto",
+    justifyContent: "center",
+    width: theme.spacing(3),
+  },
+
+  [`& .${classes.rowLabel}`]: {
+    color: theme.palette.text.primary,
+    fontFamily: "inherit",
+    fontSize: theme.typography.pxToRem(13),
+    lineHeight: 1.35,
+    margin: 0,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+  },
+
+  [`& .${classes.rowLabel}[data-muted="true"]`]: {
+    color: theme.palette.text.secondary,
+  },
+
+  [`& .${classes.heading}`]: {
+    fontSize: theme.typography.pxToRem(15),
+    whiteSpace: 'pre-line',
+},
+
+  [`& .${classes.secondaryHeading}`]: {
+      fontSize: theme.typography.pxToRem(15),
+      //color: theme.palette.text.secondary,
+      overflow: 'hidden',
+      display: 'block',
+      textOverflow: 'ellipsis',
+      maxWidth: 'calc(90vw)',
+      whiteSpace: 'nowrap',
+  },
+
+  [`& .${classes.taskAndTimeDisplay}`]: {
+      fontSize: theme.typography.pxToRem(12),
+      color: theme.palette.text.secondary,
+      overflow: 'hidden',
+      display: 'block',
+      textOverflow: 'ellipsis',
+      maxWidth: 'calc(90vw)',
+      whiteSpace: 'nowrap',
+  },
+
+  [`& .${classes.secondaryHeadingExpanded}`]: {
+      fontSize: theme.typography.pxToRem(15),
+      //color: theme.palette.text.secondary,
+      display: 'block',
+      overflow: 'auto',
+      maxWidth: 'calc(90vw)',
+      whiteSpace: 'break-word',
+  },
+
+  [`& .${classes.icon}`]: {
+      flex: "0 0 auto",
+      height: 16,
+      marginLeft: 3,
+      marginRight: 5,
+      verticalAlign: 'middle',
+      width: 16,
+  },
+
+  [`& .${classes.icon}[data-folder="true"]`]: {
+      color: theme.folderColor,
+  },
+
+  [`& .${classes.icon}[data-empty="true"]`]: {
+      color: theme.emptyFolderColor,
+  },
+
+  [`& .${classes.details}`]: {
+      alignItems: 'center',
+  },
+
+  [`& .${classes.column}`]: {
+      padding: '0 5px 0 0',
+      display: 'inline-block',
+      margin: 0,
+      height: 'auto',
+  },
+
+  [`& .${classes.paper}`]: {
+      width: '100%',
+      height: "100%",
+      marginBottom: 0,
+      minHeight: 0,
+      minWidth: 0,
+      overflow: "hidden",
+  },
+
+  [`& .${classes.table}`]: {
+      minWidth: 750,
+  },
+
+  [`& .${classes.visuallyHidden}`]: {
+      border: 0,
+      clip: 'rect(0 0 0 0)',
+      height: 1,
+      margin: -1,
+      overflow: 'hidden',
+      padding: 0,
+      position: 'absolute',
+      top: 20,
+      width: 1,
+  }
+}));
+function itemKey(index, data) {
+    // Find the item at the specified index.
+    // In this case "data" is an Array that was passed to List as "itemData".
+    const item = data[index];
+    if(item.root){
+        return `${item.group};${item.id}`;
+    }
+    if(item.is_group){
+        return item.group;
+    }
+    return `${item.group};${item.host};${item.full_path_text}`;
+}
+const VirtualTreeRow = React.memo(({
+  onSelectNode,
+  onExpandNode,
+  onCollapseNode,
+  onDoubleClickNode,
+  onContextMenu,
+  tabInfo,
+  selectedFolderData,
+  ...ListProps
+}) => {
+  const itemTreeData = ListProps.data[ListProps.index];
+  const item = ListProps.treeRootData[itemTreeData.group]?.[itemTreeData.host]?.[itemTreeData.full_path_text] || itemTreeData;
+  //console.log("item", item, "itemlookup", ListProps.treeRootData[itemTreeData.host]?.[itemTreeData.name])
+  const handleOnClickButton = (e) => {
+    e.stopPropagation();
+    if (itemTreeData.isOpen) {
+      onCollapseNode(item.id, {...item, group: itemTreeData.group, host: itemTreeData.host});
+    } else {
+      //snackActions.info('fetching elements...', { autoClose: false });
+      onExpandNode(item.id,  {...item, group: itemTreeData.group, host: itemTreeData.host});
+    }
+  };
+  const handleOnClickRow = (e) => {
+      onSelectNode(item.id,  {...item, group: itemTreeData.group, host: itemTreeData.host});
+  };
+  const handleContextClick = (e) => {
+      onContextMenu({event: e, item, itemTreeData});
+  }
+  const selectedPath = () => {
+      if(itemTreeData.group === selectedFolderData.group && itemTreeData.host === selectedFolderData.host){
+          if(itemTreeData.root){
+              return "selectedCallbackHierarchy";
+          }
+          if(selectedFolderData.full_path_text === itemTreeData.full_path_text){
+              return "selectedCallback";
+          }
+      }
+      return "";
+    }
+  return (
+    <div className={`${classes.rowContainer} hoverme ${selectedPath()}`.trim()}
+         style={ListProps.style}
+         onContextMenu={handleContextClick}
+         onClick={handleOnClickRow}>
+    <div className={classes.row} data-deleted={itemTreeData.deleted ? "true" : undefined}>
+        {[...Array(itemTreeData.depth)].map((o, i) => (
+            <span
+                className={classes.rowButtonWrapper}
+                key={'folder' + itemTreeData.id + 'lines' + i}
+            />
+        ))}
+
+          {itemTreeData.is_group ? (
+              <WidgetsIcon className={classes.icon} />
+          ): itemTreeData.root  ? (
+              <ComputerIcon className={classes.icon}  />
+          ) : !itemTreeData.can_have_children ? (
+              <DescriptionIcon className={classes.icon} />
+          ) : itemTreeData.isOpen ? (
+            <FontAwesomeIcon 
+              icon={faFolderOpen} 
+              className={classes.icon}
+              data-folder={item?.has_children || item.success ? "true" : undefined}
+              data-empty={item?.has_children || item.success ? undefined : "true"}
+              size={"lg"}
+              onClick={handleOnClickButton} />
+          ) : (
+              <FontAwesomeIcon 
+                className={classes.icon}
+                data-folder={item?.has_children || item.success ? "true" : undefined}
+                data-empty={item?.has_children || item.success ? undefined : "true"}
+                size={"lg"}
+                icon={faFolder} onClick={handleOnClickButton} />
+          )}
+          <Typography
+              className={classes.rowLabel}
+              data-muted={item?.has_children || item.success !== null ? undefined : "true"}
+              component="pre">
+              {itemTreeData.name}
+          </Typography>
+
+          {item.success === true && itemTreeData.depth > 0 ? (
+              <MythicStyledTooltip title='Successfully listed contents of folder'>
+                  <CheckCircleOutlineIcon className={classes.icon} fontSize='small' color="success" />
+              </MythicStyledTooltip>
+          ) : item.success === false && itemTreeData.depth > 0 ? (
+              <MythicStyledTooltip title='Failed to list contents of folder'>
+                  <ErrorIcon className={classes.icon} fontSize='small' color="error" />
+              </MythicStyledTooltip>
+          ) : null}
+
+    </div>
+    </div>
+  );
+}, areEqual);
+const caseInsensitiveCompare = (a, b) => {
+    try{
+        return a.localeCompare(b);
+    }catch(error){
+        console.log("localeCompare failed for", a, b);
+        return a < b;
+    }
+}
+const FileBrowserVirtualTreePreMemo = ({
+  treeRootData,
+  treeAdjMatrix,
+  openNodes,
+  onSelectNode,
+  onExpandNode,
+  onCollapseNode,
+  onContextMenu,
+  showDeletedFiles,
+  selectedFolderData,
+  tabInfo,
+}) => {
+    const gridRef = React.useRef(null);
+  const flattenNode = useCallback(
+    // node is just a full_path_text
+    (node, group, host, depth = 0) => {
+        //console.log(node, group, host, depth);
+      if(depth === 0){
+        return [
+          {
+            id: treeRootData[group]?.[host]?.[node].id,
+            name: treeRootData[group]?.[host]?.[node].name_text,
+            full_path_text: treeRootData[group]?.[host]?.[node].full_path_text,
+            deleted: treeRootData[group]?.[host]?.[node].deleted,
+            depth,
+            isLeaf: Object.keys(treeAdjMatrix[group]?.[host]?.[node] || {}).length === 0,
+            can_have_children: treeRootData[group]?.[host]?.[node].can_have_children,
+            isOpen: true,
+            children: (treeAdjMatrix[group][host]?.[node] || {}),
+            host,
+            group,
+            root: true
+          },
+          ...(Object.keys(treeAdjMatrix[group]?.[host]?.[node] || {})).sort(caseInsensitiveCompare).reduce( (prev, cur) => {
+            if(!treeRootData[group][host][cur].can_have_children){return [...prev]}
+            return [...prev, flattenNode(cur, group, host, depth+1)];
+        }, []).flat()
+        ];
+      }
+      if (openNodes[`${group};${host};${treeRootData[group][host][node].full_path_text}`] === true) {
+        return [
+          {
+            id: treeRootData[group][host][node].id,
+            name: treeRootData[group][host][node].name_text,
+            full_path_text: treeRootData[group][host][node].full_path_text,
+            deleted: treeRootData[group][host][node].deleted,
+            depth,
+            isLeaf: Object.keys(treeAdjMatrix[group]?.[host]?.[node] || {}).length === 0,
+            can_have_children: treeRootData[group][host][node].can_have_children,
+            isOpen: true,
+            children: (treeAdjMatrix[group]?.[host]?.[node] || {}),
+            host,
+            group,
+            root: false,
+          },
+          ...(Object.keys(treeAdjMatrix[group]?.[host]?.[node] || {})).sort(caseInsensitiveCompare).reduce( (prev, cur) => {
+            if(!treeRootData[group][host][cur].can_have_children){return [...prev]}
+            if(!showDeletedFiles && treeRootData[group][host][cur].deleted){return [...prev]}
+            return [...prev, flattenNode(cur, group, host, depth+1)];
+        }, []).flat()
+        ];
+      }
+      return [
+        {
+          id: treeRootData[group]?.[host]?.[node].id,
+          name: treeRootData[group]?.[host]?.[node].name_text,
+          full_path_text: treeRootData[group]?.[host]?.[node].full_path_text,
+          deleted: treeRootData[group]?.[host]?.[node].deleted,
+          depth,
+          isLeaf: Object.keys(treeAdjMatrix[group]?.[host]?.[node] || {}).length === 0,
+          can_have_children: treeRootData[group]?.[host]?.[node].can_have_children,
+          isOpen: false,
+          children: (treeAdjMatrix[group]?.[host]?.[node] || {}),
+          host,
+          group,
+          root: false,
+        }
+      ];
+     
+    },
+    [openNodes, showDeletedFiles, treeAdjMatrix] // eslint-disable-line react-hooks/exhaustive-deps
+  );
+  const flattenedNodes = useMemo(() => {
+    //console.log("in tree", treeRootData, treeAdjMatrix)
+    // need to return an array
+    let finalData = [];
+    //console.log(treeAdjMatrix);
+      const groupKeys = Object.keys(treeAdjMatrix).sort(caseInsensitiveCompare);
+      for(let i = 0; i < groupKeys.length; i++){
+        finalData.push({
+            id: groupKeys[i],
+            name: groupKeys[i],
+            depth: 0,
+            isLeaf: false,
+            isOpen: true,
+            can_have_children: true,
+            root: false,
+            group: groupKeys[i],
+            is_group: true,
+            deleted: false,
+            success: true,
+            children: treeAdjMatrix[groupKeys[i]],
+            full_path_text: groupKeys[i],
+        });
+        const hostKeys = Object.keys(treeAdjMatrix[groupKeys[i]]).sort(caseInsensitiveCompare);
+        for(let j = 0; j < hostKeys.length; j++){
+        //for(const [host, matrix] of Object.entries(hosts)){
+            finalData.push({
+                id: hostKeys[j],
+                name: hostKeys[j],
+                depth: 1,
+                isLeaf: false,
+                isOpen: true,
+                can_have_children: true,
+                host: hostKeys[j],
+                group: groupKeys[i],
+                root: true,
+                deleted: false,
+                children: treeAdjMatrix[groupKeys[i]][hostKeys[j]][""],
+                full_path_text: hostKeys[j],
+            });
+            //console.log(matrix);
+            finalData.push(...Object.keys(treeAdjMatrix[groupKeys[i]][hostKeys[j]][""]).sort(caseInsensitiveCompare).reduce((prev, c) => {
+                if(!showDeletedFiles && c.deleted) {
+                    return [...prev];
+                } else {
+                    return [...prev, ...flattenNode(c, groupKeys[i], hostKeys[j], 2)]
+                }
+            }, []).flat())
+        }
+    }
+    return finalData;
+    //nodes.map((node) => flattenNode(node)).flat()
+  },[flattenNode, treeRootData, treeAdjMatrix, showDeletedFiles]);
+  React.useEffect( () => {
+      let rowIndex = flattenedNodes?.findIndex(e =>
+          e.full_path_text === selectedFolderData.full_path_text &&
+          e.host === selectedFolderData.host &&
+          e.group === selectedFolderData.group
+      );
+      if(rowIndex >= 0){
+          if(gridRef.current){
+              gridRef.current?.scrollToItem(rowIndex, "smart")
+          }
+      }
+  }, [selectedFolderData, flattenedNodes]);
+  return flattenedNodes.length > 0 ? (
+    <div className="mythic-process-browser-table-shell flex flex-column h-full min-h-0 min-w-0 overflow-hidden w-full relative">
+      <StyledAutoSizer>
+      {(AutoSizerProps) => (
+        <List
+          itemData={flattenedNodes}
+          layout="vertical"
+          height={AutoSizerProps.height}
+          width={AutoSizerProps.width}
+          itemCount={flattenedNodes.length}
+          itemKey={itemKey}
+          itemSize={24}
+          ref={gridRef}
+        >
+          {(ListProps) => (
+            <VirtualTreeRow
+              {...ListProps}
+              tabInfo={tabInfo}
+              selectedFolderData={selectedFolderData}
+              treeRootData={treeRootData}
+              onSelectNode={onSelectNode}
+              onExpandNode={onExpandNode}
+              onCollapseNode={onCollapseNode}
+              onContextMenu={onContextMenu}
+            />
+          )}
+        </List>
+      )}
+    </StyledAutoSizer>
+    </div>
+  ) : null;
+};
+export const FileBrowserVirtualTree = React.memo(FileBrowserVirtualTreePreMemo);

MythicReactUI/src/components/MythicComponents/MythicFileContext.js

@@ -0,0 +1,102 @@
+import React from 'react';
+import {snackActions} from "../utilities/Snackbar";
+import {MythicStyledTooltip} from "./MythicStyledTooltip";
+import {MythicDialog} from "./MythicDialog";
+import {gql} from '@apollo/client';
+import {b64DecodeUnicode} from "../pages/Callbacks/ResponseDisplay";
+import {PreviewFileMediaDialog} from "./PreviewFileMedia";
+import {faPhotoVideo} from '@fortawesome/free-solid-svg-icons';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {useMythicLazyQuery} from "../utilities/useMythicLazyQuery";
+import {FileDownloadLinkWithAuth} from "../utilities/FileDownloadWithAuth";
+
+export const getfileInformationQuery = gql`
+query getFileInformation($file_id: String!){
+    filemeta(where: {agent_file_id: {_eq: $file_id}}){
+        filename_text
+        agent_file_id
+    }
+}
+`;
+
+export const MythicFileContext = ({agent_file_id, display_link, filename, extraStyles}) => {
+    const [fileData, setFileData] = React.useState({
+        agent_file_id: agent_file_id,
+        display_link: display_link,
+        filename: filename,
+    })
+    const [openPreviewMediaDialog, setOpenPreviewMediaDialog] = React.useState(false);
+    const onPreviewMedia = (event) => {
+        if(event){
+            event.preventDefault();
+            event.stopPropagation();
+        }
+        setOpenPreviewMediaDialog(true);
+    }
+    const getFileInformationSuccess = (data) => {
+        if(data.filemeta.length === 0){
+            setFileData({
+                filename: undefined,
+                display_link: "",
+                agent_file_id: agent_file_id,
+            })
+            return;
+        }
+        setFileData( {...fileData,
+            agent_file_id: data.filemeta[0].agent_file_id,
+            filename: b64DecodeUnicode(data.filemeta[0].filename_text)});
+        if(display_link === "" || display_link === undefined){
+            setFileData( {...fileData,
+                agent_file_id: data.filemeta[0].agent_file_id,
+                filename: b64DecodeUnicode(data.filemeta[0].filename_text),
+                display_link: b64DecodeUnicode(data.filemeta[0].filename_text)});
+        }
+    }
+    const getFileInformationError = (data) => {
+        snackActions.error("Failed to fetch file data: " + data);
+        console.log(data);
+    }
+    const getFileInformation = useMythicLazyQuery(getfileInformationQuery, {
+        fetchPolicy: "no-cache"
+    })
+    React.useEffect( () => {
+        if(agent_file_id !== '' && agent_file_id !== undefined){
+            getFileInformation({variables: {file_id: agent_file_id}})
+                .then(({data}) => getFileInformationSuccess(data)).catch((data) => getFileInformationError(data));
+        }
+    }, [filename, agent_file_id]);
+    if(agent_file_id === '' || agent_file_id === undefined){
+        return null
+    }
+    if(fileData.agent_file_id === '' || fileData.filename === undefined){
+        return agent_file_id
+    }
+    const onClose = (e) => {
+        if(e){
+            e.preventDefault();
+            e.stopPropagation();
+        }
+        setOpenPreviewMediaDialog(false)
+    }
+    return (
+        <>
+            <MythicStyledTooltip title={"Preview Media"} tooltipStyle={extraStyles ? extraStyles : {}}>
+                <FontAwesomeIcon icon={faPhotoVideo}
+                                 style={{height: "20px", position: "relative", cursor: "pointer", display: "inline-block"}}
+                                 onClick={onPreviewMedia} />
+            </MythicStyledTooltip>
+            <FileDownloadLinkWithAuth style={{wordBreak: "break-all"}} color="textPrimary" underline="always" href={"/direct/download/" + fileData.agent_file_id}>
+                {fileData.display_link === "" ? window.location.origin + "/direct/download/" + fileData.agent_file_id : fileData.display_link}
+            </FileDownloadLinkWithAuth>
+            {openPreviewMediaDialog &&
+                <MythicDialog fullWidth={true} maxWidth="xl" open={openPreviewMediaDialog}
+                              onClose={onClose}
+                              innerDialog={<PreviewFileMediaDialog
+                                  agent_file_id={fileData.agent_file_id}
+                                  filename={fileData.filename}
+                                  onClose={onClose} />}
+                />
+            }
+        </>
+    )
+}

MythicReactUI/src/components/MythicComponents/MythicFileUpload.js

@@ -0,0 +1,148 @@
+import {snackActions} from '../utilities/Snackbar';
+import {mythicFetch} from '../utilities/MythicConnection';
+
+export const UploadTaskFile = async (file, comment) => {
+  let formData = new FormData();
+  try{
+    formData.append("file", file);
+    formData.append("comment", comment);
+    snackActions.info("Uploading " + file.name + " to Mythic...", {autoHideDuration: 1000});
+  }catch(error){
+    console.log(error)
+    return null;
+  }
+  try{
+    const upload_response = await mythicFetch('/task_upload_file_webhook', {
+      method: 'POST',
+      body: formData,
+      headers: {
+        "Authorization": `Bearer ${localStorage.getItem("access_token")}`,
+        MythicSource: "web",
+      }
+    });
+    try{
+      const upload_result = upload_response.json().then(data => {
+          if(data?.status === "error"){
+            snackActions.error(data.error || "Failed to upload file");
+            return null;
+          }
+          return data?.agent_file_id || null;
+        }).catch(error => {
+          snackActions.warning("Error: " + upload_response.statusText + "\nError Code: " + upload_response.status);
+          console.log("Error trying to get json response", error.toString());
+          return null;
+        });
+        return upload_result;
+    }catch(error){
+      snackActions.error(error.toString());
+      return null;
+    }
+  }catch(error){
+      snackActions.error(error.toString());
+      return null;
+  }
+}
+
+export const UploadDirectFile = async (agent_file_id, file) => {
+  let formData = new FormData();
+  try{
+    formData.append("file", file);
+    //snackActions.info("Saving " + file.name + " to Mythic...", {autoHideDuration: 1000});
+  }catch(error){
+    console.log(error)
+    return null;
+  }
+  try{
+    const upload_response = await mythicFetch('/direct/upload/' + agent_file_id, {
+      method: 'POST',
+      body: formData,
+      headers: {
+        "Authorization": `Bearer ${localStorage.getItem("access_token")}`,
+        MythicSource: "web",
+      }
+    });
+    try{
+      return upload_response.json().then(data => {
+        if(data?.status === "error"){
+          snackActions.error(data.error || "Failed to save file");
+          return data;
+        }
+        return data;
+      }).catch(error => {
+        snackActions.warning("Error: " + upload_response.statusText + "\nError Code: " + upload_response.status);
+        console.log("Error trying to get json response", error.toString());
+        return null;
+      });
+    }catch(error){
+      snackActions.error(error.toString());
+      return null;
+    }
+  }catch(error){
+      snackActions.error(error.toString());
+      return null;
+  }
+}
+export const UploadEventFile = async (file, comment) => {
+  let formData = new FormData();
+  formData.append("file", file);
+  formData.append("comment", comment);
+  snackActions.info("Uploading " + file.name + " to Mythic...", {autoHideDuration: 1000});
+  try{
+    const upload_response = await mythicFetch('/eventing_import_webhook', {
+      method: 'POST',
+      body: formData,
+      headers: {
+        "Authorization": `Bearer ${localStorage.getItem("access_token")}`
+      }
+    });
+    try{
+      return upload_response.json().then(data => {
+        //console.log(data);
+        return data;
+      }).catch(error => {
+        console.log(upload_response);
+        snackActions.warning("Error: " + upload_response.statusText + "\nError Code: " + upload_response.status);
+        console.log("Error trying to get json response", error.toString());
+        return null;
+      });
+    }catch(error){
+      snackActions.error(error.toString());
+      return null;
+    }
+  }catch(error){
+    snackActions.error(error.toString());
+    return null;
+  }
+}
+export const UploadEventGroupFile = async (file, eventgroup_id) => {
+  let formData = new FormData();
+  formData.append("eventgroup_id", eventgroup_id);
+  formData.append("file", file);
+  snackActions.info("Uploading " + file.name + " to Mythic...", {autoHideDuration: 1000});
+  try{
+    const upload_response = await mythicFetch('/eventing_register_file_webhook', {
+      method: 'POST',
+      body: formData,
+      headers: {
+        "Authorization": `Bearer ${localStorage.getItem("access_token")}`
+      }
+    });
+    try{
+      return upload_response.json().then(data => {
+        //console.log(data);
+        return data;
+      }).catch(error => {
+        console.log(upload_response);
+        snackActions.warning("Error: " + upload_response.statusText + "\nError Code: " + upload_response.status);
+        console.log("Error trying to get json response", error.toString());
+        return null;
+      });
+    }catch(error){
+      snackActions.error(error.toString());
+      return null;
+    }
+  }catch(error){
+    snackActions.error(error.toString());
+    return null;
+  }
+}

MythicReactUI/src/components/MythicComponents/MythicNestedMenus.js

@@ -0,0 +1,263 @@
+import * as React from "react";
+import styled from "@emotion/styled";
+import Menu from "@mui/material/Menu";
+import MenuItem from "@mui/material/MenuItem";
+import ArrowRight from "@mui/icons-material/ArrowRight";
+// slightly modified from https://medium.com/geekculture/creating-a-dropdown-with-nested-menu-items-using-react-mui-bb0c084226da
+export const Dropdown = React.forwardRef(
+    (
+        {
+            menu,
+            isOpen: controlledIsOpen,
+            onOpen: onControlledOpen,
+            externallyOpen,
+            minWidth,
+            absoluteX,
+            absoluteY,
+            anchorReference="anchorEl",
+            style,
+            transformOrigin,
+            anchorOrigin,
+            MenuListProps,
+            PaperProps,
+        },
+        ref
+    ) => {
+        const [isInternalOpen, setInternalOpen] = React.useState(null);
+
+        const isOpen = controlledIsOpen || isInternalOpen;
+
+        let anchorRef = React.useRef(isOpen);
+        if (ref) {
+            anchorRef = ref;
+        }
+        const handleClose = (event) => {
+            event.stopPropagation();
+
+            if (anchorRef.current && anchorRef.current.contains(event.target)) {
+                return;
+            }
+
+            handleForceClose();
+        };
+        const handleForceClose = () => {
+            onControlledOpen ? onControlledOpen(null) : setInternalOpen(null);
+        };
+        const renderMenu = (menuItem, index) => {
+            const { ...props } = menuItem.props;
+
+            let extraProps = {};
+            if (props.menu) {
+                extraProps = {
+                    parentMenuOpen: isOpen
+                };
+            }
+            return React.createElement(menuItem.type, {
+                ...props,
+                key: index,
+                ...extraProps,
+                onClick: (event) => {
+                    event.stopPropagation();
+                    if (menuItem.props.onClick) {
+                        menuItem.props.onClick(event);
+                    }
+                },
+                children: props.menu
+                    ? React.Children.map(props.menu, renderMenu)
+                    : props.children
+            });
+        };
+        const anchorEl = isOpen && isOpen.currentTarget ? isOpen.currentTarget : isOpen;
+        return (
+            <>
+                <Menu
+                    elevation={5}
+                    PaperProps={{
+                        ...PaperProps,
+                        sx: { minWidth: minWidth ?? 0, ...(PaperProps?.sx || {}) }
+                    }}
+                    MenuListProps={MenuListProps}
+                    style={{zIndex: 100000, position: "absolute"}}
+                    anchorEl={anchorReference === "anchorEl" ? anchorEl : undefined}
+                    transition={"true"}
+                    open={!!externallyOpen}
+                    anchorPosition={anchorReference === "anchorEl" ? undefined : {top: absoluteY, left: absoluteX}}
+                    anchorReference={ anchorReference ? anchorReference : "anchorEl"}
+                    onClose={handleClose}
+                    anchorOrigin={anchorOrigin ? anchorOrigin : {
+                        vertical: 'bottom',
+                        horizontal: 'left',
+                    }}
+                    transformOrigin={transformOrigin ? transformOrigin : {
+                        vertical: 'top',
+                        horizontal: 'left',
+                    }}
+                >
+                    {React.Children.map(menu, renderMenu)}
+                </Menu>
+            </>
+        );
+    }
+);
+
+const NestedMenuItem = React.forwardRef((props, ref) => {
+    const {
+        parentMenuOpen,
+        label,
+        rightIcon = <ArrowRight style={{ fontSize: 16 }} />,
+        children,
+        customTheme,
+        className,
+        tabIndex: tabIndexProp,
+        ContainerProps: ContainerPropsProp = {},
+        rightAnchored,
+        ...MenuItemProps
+    } = props;
+
+    const { ref: containerRefProp, ...ContainerProps } = ContainerPropsProp;
+
+    const menuItemRef = React.useRef(null);
+    React.useImperativeHandle(ref, () => menuItemRef.current);
+
+    const containerRef = React.useRef(null);
+    React.useImperativeHandle(containerRefProp, () => containerRef.current);
+
+    const menuContainerRef = React.useRef(null);
+
+    const [isSubMenuOpen, setIsSubMenuOpen] = React.useState(false);
+
+    const handleMouseEnter = (event) => {
+        setIsSubMenuOpen(true);
+
+        if (ContainerProps?.onMouseEnter) {
+            ContainerProps.onMouseEnter(event);
+        }
+    };
+
+    const handleMouseLeave = (event) => {
+        setIsSubMenuOpen(false);
+
+        if (ContainerProps?.onMouseLeave) {
+            ContainerProps.onMouseLeave(event);
+        }
+    };
+
+    const isSubmenuFocused = () => {
+        const active = containerRef.current?.ownerDocument?.activeElement;
+
+        for (const child of menuContainerRef.current?.children ?? []) {
+            if (child === active) {
+                return true;
+            }
+        }
+        return false;
+    };
+
+    const handleFocus = (event) => {
+        if (event.target === containerRef.current) {
+            setIsSubMenuOpen(true);
+        }
+
+        if (ContainerProps?.onFocus) {
+            ContainerProps.onFocus(event);
+        }
+    };
+
+    const handleKeyDown = (event) => {
+        if (event.key === "Escape") {
+            setIsSubMenuOpen(false);
+            return;
+        }
+
+        if (isSubmenuFocused()) {
+            event.stopPropagation();
+        }
+
+        const active = containerRef.current?.ownerDocument?.activeElement;
+
+        if (event.key === "ArrowLeft" && isSubmenuFocused()) {
+            containerRef.current?.focus();
+        }
+
+        if (
+            event.key === "ArrowRight" &&
+            event.target === containerRef.current &&
+            event.target === active
+        ) {
+            const firstChild = menuContainerRef.current?.children[0];
+            firstChild?.focus();
+        }
+        if(event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "ArrowLeft"){
+            setIsSubMenuOpen(false);
+        }
+
+
+    };
+
+    const open = isSubMenuOpen && parentMenuOpen;
+
+    let tabIndex;
+    if (!props.disabled) {
+        tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;
+    }
+
+    return (
+        <div
+            {...ContainerProps}
+            ref={containerRef}
+            onFocus={handleFocus}
+            tabIndex={tabIndex}
+            onMouseEnter={handleMouseEnter}
+            onMouseLeave={handleMouseLeave}
+            onKeyDown={handleKeyDown}
+        >
+            <MenuItem
+                {...MenuItemProps}
+                data-open={!!open || undefined}
+                className={className}
+                ref={menuItemRef}
+            >
+                {label}
+                <div style={{ flexGrow: 1 }} />
+                {rightIcon}
+            </MenuItem>
+            <Menu
+                hideBackdrop
+                disablePortal
+                disableEnforceFocus={false}
+                disableAutoFocus={false}
+                style={{ pointerEvents: "none", zIndex: 100000}}
+                anchorEl={menuItemRef.current}
+                anchorOrigin={{
+                    vertical: "top",
+                    horizontal: rightAnchored ? "left" : "right"
+                }}
+                transformOrigin={{
+                    vertical: "top",
+                    horizontal: rightAnchored ? "right" : "left"
+                }}
+                css={customTheme}
+                open={!!open}
+                onClose={() => {
+                    setIsSubMenuOpen(false);
+                }}
+                MenuListProps={{
+                    'aria-hidden': false,
+                    role: 'menu'
+                }}
+            >
+                <div ref={menuContainerRef} style={{ pointerEvents: "auto" }}>
+                    {children}
+                </div>
+            </Menu>
+        </div>
+    );
+});
+
+export const DropdownMenuItem = styled(MenuItem)`
+
+`;
+
+export const DropdownNestedMenuItem = styled(NestedMenuItem)`
+
+`;

MythicReactUI/src/components/MythicComponents/MythicPageBody.js

@@ -0,0 +1,16 @@
+
+export const MythicPageBody = ({children}) => {
+    return (
+        <div style={{
+            height: "100%",
+            display: "flex",
+            flexDirection: "column",
+            padding: "0.5rem",
+            gap: "0.2rem",
+            minWidth: 0,
+            minHeight: 0,
+        }}>
+            {children}
+        </div>
+    )
+}

MythicReactUI/src/components/MythicComponents/MythicPageHeader.js

@@ -0,0 +1,270 @@
+import Box from '@mui/material/Box';
+import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import {alpha, useTheme} from '@mui/material/styles';
+import {MythicChip} from './MythicChip';
+
+export const MythicPageHeader = ({
+    actions,
+    children,
+    className = "",
+    dense = false,
+    icon,
+    meta,
+    style = {},
+    subtitle,
+    sx = {},
+    title,
+    headerVariant = "h6",
+}) => {
+    const theme = useTheme();
+    const headerTextColor = theme.pageHeaderText?.main || theme.palette.text.primary;
+    const supportingTextColor = alpha(headerTextColor, 0.78);
+    const hasActionContent = actions || children;
+    const actionSurface = alpha(headerTextColor, 0.1);
+    const actionSurfaceHover = alpha(headerTextColor, 0.16);
+    const actionSurfaceActive = alpha(headerTextColor, 0.23);
+    const actionBorder = alpha(headerTextColor, 0.24);
+    const actionBorderHover = alpha(headerTextColor, 0.42);
+    return (
+        <Paper
+            className={`mythic-page-header${className ? ` ${className}` : ""}`}
+            elevation={0}
+            style={style}
+            sx={{
+                alignItems: {xs: "stretch", md: "center"},
+                backgroundColor: theme.pageHeader.main,
+                border: `1px solid ${alpha(headerTextColor, 0.18)}`,
+                borderRadius: `${theme.shape.borderRadius}px`,
+                boxShadow: `inset 0 1px 0 ${alpha(headerTextColor, 0.12)}`,
+                color: headerTextColor,
+                display: "flex",
+                flex: "0 0 auto",
+                flexDirection: {xs: "column", md: "row"},
+                flexWrap: {xs: "nowrap", md: "wrap"},
+                gap: dense ? 0.75 : 1,
+                height: "auto",
+                justifyContent: "space-between",
+                maxHeight: "none",
+                minHeight: dense ? 44 : 58,
+                minWidth: 0,
+                overflow: "visible",
+                p: dense ? "0.5rem 0.75rem" : "0.7rem 0.85rem",
+                width: "100%",
+                "& .MuiButton-root, & .MuiToggleButton-root": {
+                    alignItems: "center",
+                    backgroundColor: `${actionSurface} !important`,
+                    border: `1px solid ${actionBorder} !important`,
+                    borderRadius: `${theme.shape.borderRadius}px`,
+                    boxShadow: "none !important",
+                    color: `${headerTextColor} !important`,
+                    fontSize: "0.76rem",
+                    fontWeight: 750,
+                    gap: 0.35,
+                    justifyContent: "center",
+                    letterSpacing: 0,
+                    lineHeight: 1.2,
+                    minHeight: 32,
+                    minWidth: {xs: "auto", sm: "7rem"},
+                    px: 1.05,
+                    textTransform: "none",
+                    whiteSpace: "nowrap",
+                    "&:hover": {
+                        backgroundColor: `${actionSurfaceHover} !important`,
+                        borderColor: `${actionBorderHover} !important`,
+                        boxShadow: `inset 0 1px 0 ${alpha(headerTextColor, 0.12)}`,
+                    },
+                },
+                "& .MuiButton-root.Mui-focusVisible, & .MuiToggleButton-root.Mui-focusVisible": {
+                    outline: `2px solid ${alpha(headerTextColor, 0.38)}`,
+                    outlineOffset: 2,
+                },
+                "& .MuiButton-root.Mui-disabled, & .MuiToggleButton-root.Mui-disabled": {
+                    backgroundColor: `${alpha(headerTextColor, 0.04)} !important`,
+                    borderColor: `${alpha(headerTextColor, 0.1)} !important`,
+                    color: `${alpha(headerTextColor, 0.38)} !important`,
+                },
+                "& .MuiToggleButton-root.Mui-selected": {
+                    backgroundColor: `${actionSurfaceActive} !important`,
+                    borderColor: `${alpha(headerTextColor, 0.48)} !important`,
+                    color: `${headerTextColor} !important`,
+                    boxShadow: `inset 0 1px 0 ${alpha(headerTextColor, 0.16)}`,
+                    "&:hover": {
+                        backgroundColor: `${alpha(headerTextColor, 0.28)} !important`,
+                    },
+                },
+                "& .MuiButton-startIcon, & .MuiButton-endIcon": {
+                    color: "inherit",
+                    marginLeft: 0,
+                    marginRight: 0,
+                },
+                "& .MuiButton-startIcon": {
+                    paddingRight: "0.25rem",
+                },
+                "& .MuiButton-endIcon": {
+                    paddingLeft: "0.25rem",
+                },
+                "& .MuiIconButton-root": {
+                    backgroundColor: `${actionSurface} !important`,
+                    border: `1px solid ${actionBorder} !important`,
+                    borderRadius: `${theme.shape.borderRadius}px`,
+                    color: `${headerTextColor} !important`,
+                    height: 32,
+                    width: 32,
+                    "&:hover": {
+                        backgroundColor: `${actionSurfaceHover} !important`,
+                        borderColor: `${actionBorderHover} !important`,
+                    },
+                    "&.Mui-disabled": {
+                        backgroundColor: `${alpha(headerTextColor, 0.04)} !important`,
+                        borderColor: `${alpha(headerTextColor, 0.1)} !important`,
+                        color: `${alpha(headerTextColor, 0.38)} !important`,
+                    },
+                },
+                ...sx,
+            }}
+        >
+            <Stack direction="row" sx={{gap: 1, minWidth: 0, flex: {xs: "0 1 auto", md: "1 1 24rem"}}}>
+                {icon &&
+                    <Box sx={{
+                        alignItems: "center",
+                        backgroundColor: alpha(headerTextColor, 0.1),
+                        border: `1px solid ${alpha(headerTextColor, 0.16)}`,
+                        borderRadius: `${theme.shape.borderRadius}px`,
+                        display: "inline-flex",
+                        flex: "0 0 auto",
+                        height: dense ? 32 : 36,
+                        justifyContent: "center",
+                        mt: subtitle || meta ? 0.15 : 0,
+                        width: dense ? 32 : 36,
+                    }}>
+                        {icon}
+                    </Box>
+                }
+                <Box sx={{display: "flex", flexDirection: "column", gap: 0.25, minWidth: 0}}>
+                    <Typography
+                        variant={headerVariant}
+                        sx={{
+                            color: headerTextColor,
+                            fontWeight: 750,
+                            letterSpacing: 0,
+                            lineHeight: 1.18,
+                            minWidth: 0,
+                        }}
+                    >
+                        {title}
+                    </Typography>
+                    {subtitle &&
+                        <Typography
+                            component="div"
+                            sx={{
+                                color: supportingTextColor,
+                                fontSize: "0.78rem",
+                                fontWeight: 600,
+                                lineHeight: 1.35,
+                                maxWidth: "64rem",
+                            }}
+                        >
+                            {subtitle}
+                        </Typography>
+                    }
+                    {meta &&
+                        <Box sx={{alignItems: "center", display: "flex", flexWrap: "wrap", gap: 0.5, mt: 0.25}}>
+                            {meta}
+                        </Box>
+                    }
+                </Box>
+            </Stack>
+            {hasActionContent &&
+                <Stack direction="row" sx={{
+                    alignContent: "center",
+                    alignItems: "center",
+                    color: headerTextColor,
+                    flex: "0 1 auto",
+                    flexWrap: "wrap",
+                    gap: 0.45,
+                    justifyContent: {xs: "flex-start", md: "flex-end"},
+                    maxWidth: "100%",
+                    minWidth: 0,
+                }}>
+                    {actions}
+                    {children}
+                </Stack>
+            }
+        </Paper>
+    );
+}
+
+export const MythicPageHeaderChip = ({status, sx = {}, ...props}) => {
+    const theme = useTheme();
+    const headerTextColor = theme.pageHeaderText?.main || theme.palette.text.primary;
+    const normalizedStatus = status === "active" || status === "enabled" ? "success" :
+        status === "inactive" || status === "disabled" ? "warning" :
+        status === "neutral" ? "secondary" : status;
+    const statusColor = normalizedStatus ? theme.palette[normalizedStatus]?.main : null;
+    const chipColor = statusColor || alpha(headerTextColor, 0.88);
+    return (
+        <MythicChip
+            size="small"
+            tone={normalizedStatus || "secondary"}
+            variant="outlined"
+            {...props}
+            sx={{
+                backgroundColor: statusColor ? alpha(statusColor, theme.palette.mode === "dark" ? 0.22 : 0.13) : alpha(headerTextColor, 0.08),
+                borderColor: statusColor ? alpha(statusColor, theme.palette.mode === "dark" ? 0.55 : 0.38) : alpha(headerTextColor, 0.2),
+                color: chipColor,
+                fontSize: "0.72rem",
+                fontWeight: 750,
+                height: 22,
+                letterSpacing: 0,
+                "& .MuiChip-icon": {
+                    color: statusColor ? chipColor : alpha(headerTextColor, 0.82),
+                },
+                ...sx,
+            }}
+        />
+    );
+};
+
+export const MythicSectionHeader = ({
+    actions,
+    dense = false,
+    subtitle,
+    sx = {},
+    title,
+}) => {
+    const theme = useTheme();
+    const headerTextColor = theme.pageHeaderText?.main || theme.palette.text.primary;
+    const sectionAccentColor = theme.sectionHeader?.accent || theme.palette.primary.main;
+    return (
+        <MythicPageHeader
+            actions={actions}
+            className="mythic-section-header overflow-hidden relative"
+            dense={dense}
+            subtitle={subtitle}
+            title={title}
+            sx={{
+                backgroundImage: theme.gradients?.sectionHeader,
+                borderColor: alpha(sectionAccentColor, theme.palette.mode === "dark" ? 0.55 : 0.38),
+                boxShadow: `inset 0 1px 0 ${alpha(headerTextColor, 0.22)}, 0 2px 6px ${alpha(theme.palette.common.black, theme.palette.mode === "dark" ? 0.28 : 0.12)}`,
+                mb: 0.5,
+                mt: dense ? 1 : 1.25,
+                overflow: "hidden",
+                pl: dense ? 1.45 : 1.6,
+                position: "relative",
+                "&::before": {
+                    backgroundColor: sectionAccentColor,
+                    bottom: 0,
+                    boxShadow: `0 0 0 1px ${alpha(headerTextColor, 0.2)}`,
+                    content: '""',
+                    left: 0,
+                    position: "absolute",
+                    top: 0,
+                    width: 6,
+                },
+                ...sx,
+            }}
+        />
+    );
+};

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/Cell.js

@@ -0,0 +1,213 @@
+import React, { useCallback } from 'react';
+import {classes} from './styles';
+import ClickAwayListener from '@mui/material/ClickAwayListener';
+import {Dropdown, DropdownMenuItem, DropdownNestedMenuItem} from "../MythicNestedMenus";
+
+const CellPreMemo = ({ style, rowIndex, columnIndex, data  }) => {
+    const [openContextMenu, setOpenContextMenu] = React.useState(false);
+    const rowClassName = data.gridUUID + "row" + rowIndex;
+    const rowHighlight = rowIndex % 2 === 0 ? 'MythicResizableGridRowHighlight' : '';
+    const [contextMenuOptions, setContextMenuOptions] = React.useState(data?.rowContextMenuOptions || []);
+    const dropdownAnchorRef = React.useRef(null);
+    const item = data.items[rowIndex][columnIndex];
+    const cellStyle = item?.props?.cellData?.cellStyle || {};
+    const rowStyle = data.items[rowIndex][columnIndex]?.props?.rowData?.rowStyle || {};
+    const contextMenuLocationRef = React.useRef({x: 0, y: 0});
+    const ownsContextRowRef = React.useRef(false);
+    const updateRowClass = useCallback((className, shouldAdd) => {
+        const cells = document.getElementsByClassName(rowClassName);
+        if(cells.length > 0){
+            for(const cell of cells){
+                cell.classList.toggle(className, shouldAdd);
+            }
+        }
+    }, [rowClassName]);
+    const handleDoubleClick = useCallback(
+        (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            data.onDoubleClickRow(e, rowIndex - 1, data.items[rowIndex][columnIndex]?.props?.rowData); // minus 1 to account for header row
+        },
+        [columnIndex, data, rowIndex]
+    );
+    const handleClick = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        if(data.onRowClick){
+            data.onRowClick({event, rowDataStatic: data.items[rowIndex][columnIndex]?.props?.rowData})
+        }
+    };
+    const selectedClass = data.items[rowIndex][columnIndex]?.props?.rowData?.selected ? "selectedCallback" : "";
+    const customRowClass = data.items[rowIndex][columnIndex]?.props?.rowData?.rowClassName || "";
+    const rowFirstCellClass = columnIndex === 0 ? classes.rowFirstCell : "";
+    const rowLastCellClass = columnIndex === data.items[rowIndex].length - 1 ? classes.rowLastCell : "";
+    const rowInteractiveClass = data.onRowClick ? classes.rowInteractive : "";
+    const setHoveredRow = useCallback((enabled) => {
+        updateRowClass(classes.hoveredRow, enabled);
+    }, [updateRowClass]);
+    const setContextRow = useCallback((enabled) => {
+        updateRowClass(classes.contextRow, enabled);
+    }, [updateRowClass]);
+    const onMouseEnter = useCallback(() => {
+        setHoveredRow(true);
+    }, [setHoveredRow]);
+    const onMouseLeave = useCallback(() => {
+        if(!ownsContextRowRef.current){
+            setHoveredRow(false);
+        }
+    }, [setHoveredRow]);
+    const handleMenuItemClick = (event, clickOption) => {
+        event.preventDefault();
+        event.stopPropagation();
+        clickOption({event, columnIndex, rowIndex, data: data.items[rowIndex][columnIndex]?.props?.rowData || {}});
+        setOpenContextMenu(false);
+    };
+    React.useEffect( () => {
+        if(openContextMenu){
+            ownsContextRowRef.current = true;
+            setContextRow(true);
+            setHoveredRow(true);
+        } else if(ownsContextRowRef.current){
+            ownsContextRowRef.current = false;
+            setContextRow(false);
+            setHoveredRow(false);
+        }
+    }, [openContextMenu, setContextRow, setHoveredRow]);
+    React.useEffect( () => {
+        return () => {
+            if(ownsContextRowRef.current){
+                setContextRow(false);
+                setHoveredRow(false);
+            }
+        };
+    }, [setContextRow, setHoveredRow]);
+    const handleContextClick = useCallback(
+        (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            if(item?.disableFilterMenu){
+                return;
+            }
+            contextMenuLocationRef.current.x = event.clientX;
+            contextMenuLocationRef.current.y = event.clientY;
+            if(data.onRowContextMenuClick){
+                const newMenuItems = data.onRowContextMenuClick({rowDataStatic: data.items[rowIndex][columnIndex]?.props?.rowData});
+                Promise.resolve(newMenuItems).then(function(value) {
+                    if(value.length > 0){
+                        setContextMenuOptions(value);
+                        setOpenContextMenu(true);
+                    }
+                })
+            } else {
+                if(contextMenuOptions && contextMenuOptions.length > 0){
+                    setOpenContextMenu(true);
+                }
+            }
+        },
+        [contextMenuOptions, data.onRowContextMenuClick] // eslint-disable-line react-hooks/exhaustive-deps
+    );
+    return (
+        <div style={{...style, ...cellStyle, ...rowStyle}}
+            className={`${classes.cell} ${rowClassName} ${rowHighlight} ${selectedClass} ${customRowClass} ${rowFirstCellClass} ${rowLastCellClass} ${rowInteractiveClass}`}
+            onDoubleClick={handleDoubleClick}
+            onClick={handleClick}
+            onMouseEnter={onMouseEnter}
+            onMouseLeave={onMouseLeave}
+            onContextMenu={handleContextClick} 
+            ref={dropdownAnchorRef}
+            >
+            <div className={classes.cellInner} style={{height: style.height}}>
+                {item}
+            </div>
+            <ContextMenu dropdownAnchorRef={dropdownAnchorRef} contextMenuOptions={contextMenuOptions}
+                disableFilterMenu={item?.disableFilterMenu} openContextMenu={openContextMenu}
+                         contextMenuLocationRef={contextMenuLocationRef}
+                         setOpenContextMenu={setOpenContextMenu} handleMenuItemClick={handleMenuItemClick}
+            />
+        </div>
+    );
+};
+export const ContextMenu = ({openContextMenu, dropdownAnchorRef, contextMenuOptions, setOpenContextMenu, handleMenuItemClick, contextMenuLocationRef}) => {
+    const handleClose = (event) => {
+        //if (dropdownAnchorRef.current && dropdownAnchorRef.current.contains(event.target)) {
+        //    return;
+        //}
+        setOpenContextMenu(false);
+    };
+
+    return (
+        openContextMenu &&
+        <ClickAwayListener onClickAway={handleClose} mouseEvent={"onMouseDown"}>
+            <Dropdown
+                isOpen={dropdownAnchorRef.current}
+                onOpen={setOpenContextMenu}
+                externallyOpen={openContextMenu}
+                absoluteX={contextMenuLocationRef.current.x}
+                absoluteY={contextMenuLocationRef.current.y}
+                anchorReference={"anchorPosition"}
+                menu={[
+                    contextMenuOptions.map((option, index) => (
+                        option.type === 'item' ? (
+                            <DropdownMenuItem
+                                key={option.name}
+                                disabled={option.disabled}
+                                className={option.className || (option.danger ? "mythic-action-tone-hover mythic-tone-error" : undefined)}
+                                onClick={(event) => handleMenuItemClick(event, option.click)}
+                            >
+                                {option.icon}{option.name}
+                            </DropdownMenuItem>
+                        ) : option.type === 'menu' ? (
+                            <DropdownNestedMenuItem
+                                label={option.name}
+                                disabled={option.disabled}
+                                menu={
+                                    option.menuItems.map((menuOption, indx) => (
+                                    <DropdownMenuItem
+                                        key={menuOption.name}
+                                        disabled={menuOption.disabled}
+                                        className={menuOption.className || (menuOption.danger ? "mythic-action-tone-hover mythic-tone-error" : undefined)}
+                                        onClick={(event) => handleMenuItemClick(event, menuOption.click)}
+                                    >
+                                            {menuOption.icon}{menuOption.name}
+                                        </DropdownMenuItem>
+                                    ))
+                                }
+                            />
+                        ) : null
+                    )),
+                ]}
+            />
+        </ClickAwayListener>
+
+    )
+}
+const Cell = React.memo(CellPreMemo);
+export default Cell;
+
+/*
+<Popper open={openContextMenu} anchorEl={dropdownAnchorRef.current} role={undefined} transition disablePortal style={{zIndex: 4}}>
+            {({ TransitionProps, placement }) => (
+                <Grow
+                    {...TransitionProps}
+                    style={{
+                        transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom',
+                    }}
+                >
+                    <Paper variant="outlined" style={{backgroundColor: theme.palette.mode === 'dark' ? theme.palette.primary.dark : theme.palette.primary.light, color: "white"}}>
+                        <ClickAwayListener onClickAway={handleClose} mouseEvent={"onMouseDown"}>
+                            <MenuList id="split-button-menu"  >
+                                {contextMenuOptions.map((option, index) => (
+                                    <MenuItem
+                                        key={option.name + index}
+                                        onClick={(event) => handleMenuItemClick(event, index)}
+                                    >
+                                        {option.name}
+                                    </MenuItem>
+                                ))}
+                            </MenuList>
+                        </ClickAwayListener>
+                    </Paper>
+                </Grow>
+            )}
+        </Popper>
+ */

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/GridColumnFilterDialog.js

@@ -0,0 +1,181 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import {MythicActionButton} from '../MythicActionButton';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Switch from '@mui/material/Switch';
+import TextField from '@mui/material/TextField';
+import ToggleButton from '@mui/material/ToggleButton';
+import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
+import Typography from '@mui/material/Typography';
+
+const DEFAULT_FILTER = {
+    include: [],
+    exclude: [],
+    includeMode: "any",
+    caseSensitive: false,
+};
+
+const splitFilterTerms = (value) => {
+    if(Array.isArray(value)){
+        return value.map((entry) => String(entry).trim()).filter(Boolean);
+    }
+    if(value === undefined || value === null){
+        return [];
+    }
+    return String(value)
+        .split(/[\n,]+/)
+        .map((entry) => entry.trim())
+        .filter(Boolean);
+};
+
+export const normalizeGridColumnFilter = (value) => {
+    if(value === undefined || value === null){
+        return {...DEFAULT_FILTER};
+    }
+    if(typeof value === "string" || typeof value === "number" || typeof value === "boolean"){
+        return {
+            ...DEFAULT_FILTER,
+            include: splitFilterTerms(value),
+        };
+    }
+    if(typeof value === "object"){
+        return {
+            include: splitFilterTerms(value.include),
+            exclude: splitFilterTerms(value.exclude),
+            includeMode: value.includeMode === "all" ? "all" : "any",
+            caseSensitive: Boolean(value.caseSensitive),
+        };
+    }
+    return {...DEFAULT_FILTER};
+};
+
+export const isGridColumnFilterActive = (value) => {
+    const normalizedFilter = normalizeGridColumnFilter(value);
+    return normalizedFilter.include.length > 0 || normalizedFilter.exclude.length > 0;
+};
+
+export const getUpdatedGridFilterOptions = (filterOptions, key, value) => {
+    const nextFilterOptions = {...filterOptions};
+    if(!key){
+        return nextFilterOptions;
+    }
+    const normalizedFilter = normalizeGridColumnFilter(value);
+    if(isGridColumnFilterActive(normalizedFilter)){
+        nextFilterOptions[key] = normalizedFilter;
+    }else{
+        delete nextFilterOptions[key];
+    }
+    return nextFilterOptions;
+};
+
+export const gridValuePassesFilter = (value, filterOption) => {
+    const normalizedFilter = normalizeGridColumnFilter(filterOption);
+    if(!isGridColumnFilterActive(normalizedFilter)){
+        return true;
+    }
+    const cellText = String(value ?? "");
+    const haystack = normalizedFilter.caseSensitive ? cellText : cellText.toLowerCase();
+    const normalizeTerm = (term) => normalizedFilter.caseSensitive ? term : term.toLowerCase();
+    const termMatches = (term) => haystack.includes(normalizeTerm(term));
+    const includeMatches = normalizedFilter.include.length === 0 ? true :
+        normalizedFilter.includeMode === "all" ?
+            normalizedFilter.include.every(termMatches) :
+            normalizedFilter.include.some(termMatches);
+    if(!includeMatches){
+        return false;
+    }
+    return !normalizedFilter.exclude.some(termMatches);
+};
+
+export function GridColumnFilterDialog({filterValue, onClose, onSubmit, selectedColumn}) {
+    const normalizedFilter = React.useMemo(() => normalizeGridColumnFilter(filterValue), [filterValue]);
+    const [includeText, setIncludeText] = React.useState(normalizedFilter.include.join("\n"));
+    const [excludeText, setExcludeText] = React.useState(normalizedFilter.exclude.join("\n"));
+    const [includeMode, setIncludeMode] = React.useState(normalizedFilter.includeMode);
+    const [caseSensitive, setCaseSensitive] = React.useState(normalizedFilter.caseSensitive);
+    const columnName = selectedColumn?.name || selectedColumn?.plaintext || selectedColumn?.key || "Column";
+    const buildFilter = () => ({
+        include: splitFilterTerms(includeText),
+        exclude: splitFilterTerms(excludeText),
+        includeMode,
+        caseSensitive,
+    });
+    const handleSubmit = () => {
+        onSubmit(buildFilter());
+        onClose();
+    };
+    const handleClear = () => {
+        onSubmit({...DEFAULT_FILTER});
+        onClose();
+    };
+    const onIncludeModeChange = (event, value) => {
+        if(value !== null){
+            setIncludeMode(value);
+        }
+    };
+    return (
+        <div className="mythic-grid-filter-dialog bg-surface-raised text-primary">
+            <DialogTitle className="mythic-grid-filter-dialog-title bg-header text-header text-base font-850 leading-120 border-b-subtle">
+                Filter {columnName}
+            </DialogTitle>
+            <DialogContent className="mythic-grid-filter-dialog-content flex flex-column">
+                <Typography className="mythic-grid-filter-dialog-copy text-muted text-xs font-650 leading-135" component="div">
+                    Add one term per line, or separate terms with commas. Include terms decide what can stay visible; exclude terms remove matching rows.
+                </Typography>
+                <Box className="mythic-grid-filter-dialog-mode-row items-center flex gap-6 justify-between">
+                    <Typography className="mythic-grid-filter-dialog-label text-xs font-800 text-primary" component="div">
+                        Include matching
+                    </Typography>
+                    <ToggleButtonGroup
+                        exclusive
+                        onChange={onIncludeModeChange}
+                        size="small"
+                        value={includeMode}
+                    >
+                        <ToggleButton value="any">Any</ToggleButton>
+                        <ToggleButton value="all">All</ToggleButton>
+                    </ToggleButtonGroup>
+                </Box>
+                <div className="mythic-grid-filter-dialog-fields grid grid-cols-2">
+                    <TextField
+                        fullWidth
+                        label="Include rows matching"
+                        minRows={4}
+                        multiline
+                        autoFocus
+                        onChange={(event) => setIncludeText(event.target.value)}
+                        placeholder={"admin\nprod"}
+                        value={includeText}
+                    />
+                    <TextField
+                        fullWidth
+                        label="Exclude rows matching"
+                        minRows={4}
+                        multiline
+                        onChange={(event) => setExcludeText(event.target.value)}
+                        placeholder={"debug\ntest"}
+                        value={excludeText}
+                    />
+                </div>
+                <FormControlLabel
+                    control={
+                        <Switch
+                            checked={caseSensitive}
+                            onChange={(event) => setCaseSensitive(event.target.checked)}
+                            size="small"
+                        />
+                    }
+                    label="Case sensitive"
+                />
+            </DialogContent>
+            <DialogActions className="mythic-grid-filter-dialog-actions py-6 px-8 border-t-subtle">
+                <MythicActionButton onClick={handleClear}>Clear</MythicActionButton>
+                <MythicActionButton onClick={onClose}>Cancel</MythicActionButton>
+                <MythicActionButton colorMode="always" onClick={handleSubmit} tone="primary" variant="contained">Apply Filter</MythicActionButton>
+            </DialogActions>
+        </div>
+    );
+}

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/HeaderCell.js

@@ -0,0 +1,171 @@
+import { Box, Typography } from '@mui/material';
+import { useCallback } from 'react';
+import useSingleAndDoubleClick from '../../utilities/useSingleAndDoubleClick';
+import {classes} from './styles';
+import React from 'react';
+import FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined';
+import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
+import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
+import {ContextMenu} from "./Cell";
+
+const HeaderCell = ({
+    onClick = () => {},
+    onDoubleClick = () => {},
+    contextMenuOptions = [],
+    sortIndicatorIndex,
+    sortDirection,
+    headerNameKey = "name",
+    isResizing = false,
+    onResizePointerDown = () => {},
+    VariableSizeGridProps: { style, rowIndex, columnIndex, data },
+}) => {
+    const dropdownAnchorRef = React.useRef(null);
+    const item = data.items[rowIndex][columnIndex];
+    const isFiltered = item?.filtered || false;
+    const isSorted = sortIndicatorIndex === columnIndex;
+    const HeaderSortIcon = sortDirection === 'ASC' ? KeyboardArrowUpIcon : KeyboardArrowDownIcon;
+    const headerLabel = item?.[headerNameKey] || "";
+    const contextMenuLocationRef = React.useRef({x: 0, y: 0});
+    const handleClick = useCallback(
+        (e) => {
+            onClick(e, columnIndex);
+        },
+        [onClick, columnIndex]
+    );
+
+    const handleDoubleClick = useCallback(
+        (e) => {
+            onDoubleClick(e, columnIndex);
+        },
+        [onDoubleClick, columnIndex]
+    );
+    const handleResizePointerDown = useCallback(
+        (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            onResizePointerDown(event, columnIndex);
+        },
+        [onResizePointerDown, columnIndex]
+    );
+    const handleResizeDoubleClick = useCallback(
+        (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            onDoubleClick(event, columnIndex);
+        },
+        [onDoubleClick, columnIndex]
+    );
+    const stopResizeClickPropagation = useCallback(
+        (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+        },
+        []
+    );
+    const [openContextMenu, setOpenContextMenu] = React.useState(false);
+    const menuContext = React.useMemo(() => {
+        return {columnIndex, rowIndex, data: data.items[rowIndex][columnIndex]?.props?.rowData || {}};
+    }, [columnIndex, data.items, rowIndex]);
+    const resolvedContextMenuOptions = React.useMemo(() => {
+        const resolveOption = (option) => {
+            const resolvedOption = {
+                ...option,
+                disabled: typeof option.disabled === "function" ? option.disabled(menuContext) : option.disabled,
+            };
+            if(option.menuItems){
+                resolvedOption.menuItems = option.menuItems.map(resolveOption);
+            }
+            return resolvedOption;
+        };
+        return contextMenuOptions.map(resolveOption);
+    }, [contextMenuOptions, menuContext]);
+    const handleContextClick = useCallback(
+        (event) => {
+            event.preventDefault();
+            if(resolvedContextMenuOptions && resolvedContextMenuOptions.length > 0){
+                contextMenuLocationRef.current.x = event.clientX;
+                contextMenuLocationRef.current.y = event.clientY;
+                setOpenContextMenu(true);
+            }
+        },
+        [resolvedContextMenuOptions]
+    );
+    const handleMenuItemClick = (event, clickOption) => {
+        event.preventDefault();
+        event.stopPropagation();
+        clickOption({event, ...menuContext});
+        setOpenContextMenu(false);
+    };
+    const filterMenuOption = React.useMemo(
+        () => resolvedContextMenuOptions.find((option) => option.type === "item" && option.name === "Filter Column"),
+        [resolvedContextMenuOptions]
+    );
+    const handleFilterIndicatorClick = useCallback(
+        (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            if(filterMenuOption?.disabled || !filterMenuOption?.click){
+                return;
+            }
+            filterMenuOption.click({event, ...menuContext});
+            setOpenContextMenu(false);
+        },
+        [filterMenuOption, menuContext]
+    );
+
+    const handleClicks = useSingleAndDoubleClick(handleClick, handleDoubleClick);
+    const className = `${classes.headerCell} ${item.disableSort ? classes.headerCellNoSort : ""}`;
+
+    return (
+        <div
+            style={style}
+            className={className}
+            onClick={handleClicks}
+            onContextMenu={handleContextClick}
+            ref={dropdownAnchorRef}
+            title={typeof headerLabel === "string" ? headerLabel : undefined}
+        >
+            <Box className={classes.headerContent}>
+                <Typography className={`${classes.cellInner} ${classes.headerLabel}`} component='div' variant='body1'>
+                    {typeof headerLabel === "string" ? headerLabel : headerLabel}
+                </Typography>
+                <Box className={classes.headerActions}>
+                    {isFiltered &&
+                        <button
+                            aria-label={`Edit filter for ${typeof headerLabel === "string" ? headerLabel : "column"}`}
+                            className={`${classes.headerIndicator} ${classes.headerFilterIcon}`}
+                            onClick={handleFilterIndicatorClick}
+                            title="Edit Filter"
+                            type="button"
+                        >
+                            <FilterAltOutlinedIcon fontSize="inherit" />
+                        </button>
+                    }
+                    {isSorted &&
+                        <span className={`${classes.headerIndicator} ${classes.headerSortIcon}`} title={`Sorted ${sortDirection === 'ASC' ? 'ascending' : 'descending'}`}>
+                            <HeaderSortIcon fontSize="inherit" />
+                        </span>
+                    }
+                </Box>
+                <ContextMenu dropdownAnchorRef={dropdownAnchorRef} contextMenuOptions={resolvedContextMenuOptions}
+                             disableFilterMenu={item?.disableFilterMenu} openContextMenu={openContextMenu}
+                             contextMenuLocationRef={contextMenuLocationRef}
+                             setOpenContextMenu={setOpenContextMenu} handleMenuItemClick={handleMenuItemClick}
+                />
+            </Box>
+            {!item.disableResize &&
+                <div
+                    role="separator"
+                    aria-orientation="vertical"
+                    aria-label={`Resize ${typeof headerLabel === "string" ? headerLabel : "column"} column`}
+                    className={`${classes.headerResizeHandle} ${isResizing ? classes.headerResizeHandleActive : ""}`}
+                    onPointerDown={handleResizePointerDown}
+                    onDoubleClick={handleResizeDoubleClick}
+                    onClick={stopResizeClickPropagation}
+                />
+            }
+        </div>
+    );
+};
+
+export default HeaderCell;

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/MythicResizableGrid.js

@@ -0,0 +1,647 @@
+import React, { useCallback, useEffect, useRef, useState, createContext, useContext } from 'react';
+import PropTypes from 'prop-types';
+import AutoSizer from 'react-virtualized-auto-sizer';
+import useScrollbarSize from 'react-scrollbar-size';
+import { VariableSizeGrid } from 'react-window';
+import HeaderCell from './HeaderCell';
+import Cell from './Cell';
+import {classes} from './styles';
+import {GetMythicSetting, useSetMythicSetting} from "../MythicSavedUserSetting";
+import FitScreenIcon from '@mui/icons-material/FitScreen';
+import RestartAltIcon from '@mui/icons-material/RestartAlt';
+import ViewColumnIcon from '@mui/icons-material/ViewColumn';
+import FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined';
+
+const HeaderCellContext = createContext({});
+
+const MIN_COLUMN_WIDTH = 50;
+const MIN_FLEX_COLUMN_WIDTH = 50;
+const AUTOSIZE_HORIZONTAL_PADDING = 40;
+const AUTOSIZE_HEADER_EXTRA_WIDTH = 30;
+const headerMenuIconStyle = {fontSize: "1rem", marginRight: "8px"};
+const normalizeHeaderContextMenuOption = (option) => {
+    if(option?.name === "Filter Column"){
+        return {
+            ...option,
+            icon: <FilterAltOutlinedIcon style={headerMenuIconStyle} />,
+        };
+    }
+    if(option?.menuItems){
+        return {
+            ...option,
+            menuItems: option.menuItems.map(normalizeHeaderContextMenuOption),
+        };
+    }
+    return option;
+};
+
+let autosizeCanvas;
+
+const getNumericWidth = (value) => {
+    const width = Number(value);
+    return Number.isFinite(width) ? width : undefined;
+};
+const getColumnMinWidth = (column) => {
+    const configuredMinWidth = getNumericWidth(column?.minWidth);
+    return Math.max(configuredMinWidth || 0, column?.fillWidth ? MIN_FLEX_COLUMN_WIDTH : MIN_COLUMN_WIDTH);
+};
+const getColumnMaxWidth = (column) => {
+    const configuredMaxWidth = getNumericWidth(column?.maxWidth);
+    return configuredMaxWidth && configuredMaxWidth > 0 ? configuredMaxWidth : Infinity;
+};
+const clampColumnWidth = (column, width) => {
+    const minWidth = getColumnMinWidth(column);
+    const maxWidth = getColumnMaxWidth(column);
+    const numericWidth = getNumericWidth(width) || minWidth;
+    return Math.floor(Math.min(maxWidth, Math.max(numericWidth, minWidth)));
+};
+const getPreferredColumnWidth = (column) => {
+    return column?.width === undefined ? getColumnMinWidth(column) : column.width;
+};
+const distributeFillWidth = ({columns, columnWidths, totalWidth}) => {
+    const availableWidth = Math.max(0, Math.floor(totalWidth || 0));
+    const currentWidth = columnWidths.reduce((a, b) => a + b, 0);
+    const widthDifference = availableWidth - currentWidth;
+    if(widthDifference <= 0 || columns.length === 0){
+        return columnWidths;
+    }
+    const fillColumnIndexes = columns.reduce((previous, column, index) => {
+        return column.fillWidth ? [...previous, index] : previous;
+    }, []);
+    const targetIndexes = fillColumnIndexes.length > 0 ? fillColumnIndexes : [columns.length - 1];
+    let remainingWidth = widthDifference;
+    const updatedColumnWidths = [...columnWidths];
+    for(let i = 0; i < targetIndexes.length; i++){
+        const columnIndex = targetIndexes[i];
+        const share = i === targetIndexes.length - 1 ? remainingWidth : Math.floor(widthDifference / targetIndexes.length);
+        const currentColumnWidth = updatedColumnWidths[columnIndex];
+        const nextColumnWidth = clampColumnWidth(columns[columnIndex], currentColumnWidth + share);
+        updatedColumnWidths[columnIndex] = nextColumnWidth;
+        remainingWidth -= nextColumnWidth - currentColumnWidth;
+    }
+    return updatedColumnWidths;
+};
+const getInitialColumnWidths = ({columns, savedWidths = [], totalWidth = 0}) => {
+    const hasSavedWidths = savedWidths.length === columns.length;
+    const baseColumnWidths = columns.map((column, index) => {
+        return clampColumnWidth(column, hasSavedWidths ? savedWidths[index] : getPreferredColumnWidth(column));
+    });
+    if(hasSavedWidths){
+        return baseColumnWidths;
+    }
+    return distributeFillWidth({columns, columnWidths: baseColumnWidths, totalWidth});
+};
+const areColumnWidthsEqual = (first = [], second = []) => {
+    if(first.length !== second.length){
+        return false;
+    }
+    return first.every((width, index) => Math.floor(width || MIN_COLUMN_WIDTH) === Math.floor(second[index] || MIN_COLUMN_WIDTH));
+};
+const normalizeColumnWidths = (columnWidths = []) => {
+    return columnWidths.map((columnWidth) => Math.floor(getNumericWidth(columnWidth) || MIN_COLUMN_WIDTH));
+};
+const getMeasureContext = () => {
+    if(typeof document === "undefined"){
+        return null;
+    }
+    if(autosizeCanvas === undefined){
+        autosizeCanvas = document.createElement("canvas");
+    }
+    const context = autosizeCanvas.getContext("2d");
+    if(context === null){
+        return null;
+    }
+    const referenceElement = document.querySelector(`.${classes.cell}`) || document.body;
+    const computedStyle = window.getComputedStyle(referenceElement);
+    context.font = [
+        computedStyle.fontStyle,
+        computedStyle.fontVariant,
+        computedStyle.fontWeight,
+        computedStyle.fontSize,
+        computedStyle.fontFamily,
+    ].join(" ");
+    return context;
+};
+const getDisplayText = (value) => {
+    if(value === undefined || value === null){
+        return "";
+    }
+    if(typeof value === "string"){
+        const trimmedValue = value.trim();
+        if(trimmedValue.startsWith("[")){
+            try{
+                const parsedValue = JSON.parse(trimmedValue);
+                if(Array.isArray(parsedValue) && parsedValue.length > 0){
+                    return getDisplayText(parsedValue[0]);
+                }
+            }catch(error){
+                // Keep the original string when it is not a serialized array.
+            }
+        }
+        return value;
+    }
+    if(typeof value === "number" || typeof value === "boolean"){
+        return String(value);
+    }
+    if(Array.isArray(value)){
+        return value.map((entry) => getDisplayText(entry)).filter(Boolean).join(", ");
+    }
+    if(React.isValidElement(value)){
+        return getDisplayText(value.props?.cellData || value.props?.children);
+    }
+    if(typeof value === "object"){
+        if(value.plaintext !== undefined){
+            return getDisplayText(value.plaintext);
+        }
+        if(value.name !== undefined){
+            return getDisplayText(value.name);
+        }
+        if(value.button?.name !== undefined){
+            return getDisplayText(value.button.name);
+        }
+        if(value.display !== undefined){
+            return getDisplayText(value.display);
+        }
+        return "";
+    }
+    return "";
+};
+const getCellAutosizeText = ({column, cell}) => {
+    const cellProps = cell?.props || {};
+    const columnKey = column?.key || column?.plaintext;
+    const rowData = cellProps.rowData || {};
+    const cellDataText = getDisplayText(cellProps.cellData);
+    if(cellDataText !== ""){
+        return cellDataText;
+    }
+    if(columnKey !== undefined){
+        return getDisplayText(rowData?.[columnKey]);
+    }
+    return getDisplayText(cell);
+};
+const measureAutosizeText = (context, text) => {
+    const normalizedText = getDisplayText(text);
+    if(normalizedText === ""){
+        return 0;
+    }
+    const lines = normalizedText.split(/\r?\n/);
+    return lines.reduce((longestLineWidth, line) => {
+        const textWidth = context ? context.measureText(line).width : line.length * 8;
+        return Math.max(longestLineWidth, textWidth);
+    }, 0);
+};
+const getAutosizedColumnWidth = ({column, columnIndex, headerNameKey, items}) => {
+    const measureContext = getMeasureContext();
+    const headerText = getDisplayText(column?.[headerNameKey] || column?.name || column?.plaintext);
+    const headerWidth = measureAutosizeText(measureContext, headerText.toUpperCase()) + AUTOSIZE_HEADER_EXTRA_WIDTH;
+    const widestCellWidth = items.reduce((widestWidth, itemRow) => {
+        const cellText = getCellAutosizeText({column, cell: itemRow[columnIndex]});
+        return Math.max(widestWidth, measureAutosizeText(measureContext, cellText));
+    }, 0);
+    return clampColumnWidth(column, Math.max(headerWidth, widestCellWidth) + AUTOSIZE_HORIZONTAL_PADDING);
+};
+
+const CellRendererPreMemo = ({ style, rowIndex, columnIndex, data }) => {
+    return rowIndex === 0 ? null : <Cell style={style} rowIndex={rowIndex} columnIndex={columnIndex} data={data} />;
+};
+const CellRenderer = React.memo(CellRendererPreMemo);
+const innerElementType = React.forwardRef(({ children, style }, ref) => {
+    const HeaderCellData = useContext(HeaderCellContext);
+    const resizingColumnIndex = HeaderCellData.resizingColumnIndex;
+    const resizeGuideLeft = resizingColumnIndex >= 0 ?
+        HeaderCellData.columnWidths.slice(0, resizingColumnIndex + 1).reduce((a, b) => a + b, 0) :
+        -1;
+    const onHeaderDoubleClick = React.useCallback( (e, columnIndex) => {
+        if (HeaderCellData.columns[columnIndex].disableAutosize) return;
+        HeaderCellData.autosizeColumn({columnIndex});
+    }, [HeaderCellData.columns, HeaderCellData.autosizeColumn]);
+    return (
+        <div ref={ref} style={{...style, position: "relative"}}>
+            {/* always render header cells */}
+            <div
+                className={classes.headerCellRow}
+                style={{
+                    height: HeaderCellData.getRowHeight(0),
+                }}>
+                {HeaderCellData.columns.map((column, i) => {
+                    const leftOffset = HeaderCellData.columnWidths.slice(0, i).reduce((a, b) => a + b, 0);
+                    return (
+                        <HeaderCell
+                            key={i}
+                            headerNameKey={HeaderCellData.headerNameKey}
+                            onClick={HeaderCellData.onClickHeader}
+                            onDoubleClick={onHeaderDoubleClick}
+                            contextMenuOptions={HeaderCellData.contextMenuOptions}
+                            sortIndicatorIndex={HeaderCellData.sortIndicatorIndex}
+                            sortDirection={HeaderCellData.sortDirection}
+                            isResizing={HeaderCellData.resizingColumnIndex === i}
+                            onResizePointerDown={HeaderCellData.startColumnResize}
+                            VariableSizeGridProps={{
+                                style: {
+                                    position: 'absolute',
+                                    top: 0,
+                                    left: leftOffset,
+                                    height: HeaderCellData.getRowHeight(0),
+                                    width: HeaderCellData.getColumnWidth(i),
+                                },
+                                rowIndex: 0,
+                                columnIndex: i,
+                                data: { items: HeaderCellData.itemsWithHeader },
+                            }}
+                        />
+                    );
+                })}
+            </div>
+            {/* render other cells as usual */}
+            {children}
+            {resizingColumnIndex >= 0 &&
+                <div
+                    className={classes.resizeGuide}
+                    style={{
+                        left: resizeGuideLeft,
+                        height: style.height,
+                    }}
+                />
+            }
+        </div>
+    );
+});
+
+export const GetShortRandomString = () => {
+    return (Math.random() + 1).toString(36).substring(2);
+}
+const ResizableGridWrapper = ({
+    name,
+    columns,
+    sortIndicatorIndex,
+    sortDirection,
+    items,
+    headerNameKey,
+    onClickHeader,
+    onDoubleClickRow,
+    contextMenuOptions,
+    rowContextMenuOptions,
+    onRowContextMenuClick,
+    rowHeight,
+    headerRowHeight,
+    widthMeasureKey,
+    callbackTableGridRef,
+    onRowClick,
+    ...AutoSizerProps
+}) => {
+    /* Hooks */
+    const { width: scrollbarWidth } = useScrollbarSize();
+    const localColumnsRef = React.useRef(columns);
+    const initialSavedWidths = name === undefined ? [] : GetMythicSetting({setting_name: `${name}_column_widths`, default_value: {}, output: "json-array"});
+    const savedColumnWidths = Array.isArray(initialSavedWidths) ? initialSavedWidths : [];
+    const [columnWidths, setColumnWidths] = useState(() => getInitialColumnWidths({
+        columns,
+        savedWidths: savedColumnWidths,
+        totalWidth: AutoSizerProps.width - scrollbarWidth,
+    }));
+    const gridUUID = React.useMemo( () => GetShortRandomString(), []);
+    const gridRef = useRef(null);
+    const columnWidthsRef = useRef(columnWidths);
+    const lastResetColumnIndexRef = useRef(0);
+    const activeResizeRef = useRef(null);
+    const resizeFrameRef = useRef(null);
+    const cleanupResizeListenersRef = useRef(null);
+    const [resizingColumnIndex, setResizingColumnIndex] = useState(-1);
+    const [updateSetting] = useSetMythicSetting();
+    const setColumnWidthsAndRef = useCallback( (newColumnWidths, resetColumnIndex=0) => {
+        const normalizedColumnWidths = normalizeColumnWidths(newColumnWidths);
+        if(areColumnWidthsEqual(columnWidthsRef.current, normalizedColumnWidths)){
+            return false;
+        }
+        lastResetColumnIndexRef.current = resetColumnIndex;
+        columnWidthsRef.current = normalizedColumnWidths;
+        setColumnWidths(normalizedColumnWidths);
+        return true;
+    }, []);
+    const getColumnWidth = useCallback(
+        (index) => {
+            return columnWidths[index] || MIN_COLUMN_WIDTH;
+        },
+        [columnWidths]
+    );
+    const getRowHeight = useCallback(
+        (index) => {
+            if(index === 0){
+                return headerRowHeight;
+            }
+            return rowHeight;
+        },
+        [rowHeight, headerRowHeight]
+    );
+    useEffect(() => {
+        if(savedColumnWidths.length === columns.length && localColumnsRef.current.length === columns.length){
+            return;
+        }
+        localColumnsRef.current = columns;
+        const updatedColumnWidths = getInitialColumnWidths({
+            columns,
+            savedWidths: [],
+            totalWidth: AutoSizerProps.width - scrollbarWidth,
+        });
+        const didUpdateWidths = setColumnWidthsAndRef(updatedColumnWidths);
+        if(didUpdateWidths && name !== undefined){
+            updateSetting({setting_name: `${name}_column_widths`, value: updatedColumnWidths, broadcast: false});
+        }
+
+    }, [scrollbarWidth, columns, AutoSizerProps.width, localColumnsRef.current, setColumnWidthsAndRef]); // eslint-disable-line react-hooks/exhaustive-deps
+
+    useEffect(() => {
+        if(gridRef.current){
+            gridRef.current.resetAfterColumnIndex(lastResetColumnIndexRef.current, true);
+        }
+    }, [columnWidths]);
+
+    /* Event Handlers */
+
+    const startColumnResize = useCallback( (event, columnIndex) => {
+        if(columns[columnIndex]?.disableResize){
+            return;
+        }
+        const initialWidths = columnWidthsRef.current.map( (columnWidth) => Math.floor(columnWidth || MIN_COLUMN_WIDTH));
+        const startClientX = event.clientX;
+        const startWidth = initialWidths[columnIndex] || MIN_COLUMN_WIDTH;
+        const previousCursor = document.body.style.cursor;
+        const previousUserSelect = document.body.style.userSelect;
+        const applyResizeWidth = (clientX) => {
+            const activeResize = activeResizeRef.current;
+            if(!activeResize){
+                return;
+            }
+            activeResize.latestClientX = clientX;
+            if(resizeFrameRef.current !== null){
+                return;
+            }
+            resizeFrameRef.current = window.requestAnimationFrame(() => {
+                resizeFrameRef.current = null;
+                const currentResize = activeResizeRef.current;
+                if(!currentResize){
+                    return;
+                }
+                const resizeDelta = currentResize.latestClientX - currentResize.startClientX;
+                const nextColumnWidth = clampColumnWidth(columns[currentResize.columnIndex], currentResize.startWidth + resizeDelta);
+                const updatedColumnWidths = currentResize.initialWidths.map( (columnWidth, index) => {
+                    return currentResize.columnIndex === index ? nextColumnWidth : columnWidth;
+                });
+                setColumnWidthsAndRef(updatedColumnWidths, currentResize.columnIndex);
+            });
+        };
+        const cleanupResizeListeners = () => {
+            window.removeEventListener("pointermove", handlePointerMove);
+            window.removeEventListener("pointerup", handlePointerUp);
+            window.removeEventListener("pointercancel", handlePointerUp);
+            document.body.style.cursor = previousCursor;
+            document.body.style.userSelect = previousUserSelect;
+            cleanupResizeListenersRef.current = null;
+        };
+        const finishResize = (clientX) => {
+            const currentResize = activeResizeRef.current;
+            if(!currentResize){
+                cleanupResizeListeners();
+                return;
+            }
+            if(resizeFrameRef.current !== null){
+                window.cancelAnimationFrame(resizeFrameRef.current);
+                resizeFrameRef.current = null;
+            }
+            const resizeDelta = clientX - currentResize.startClientX;
+            const nextColumnWidth = clampColumnWidth(columns[currentResize.columnIndex], currentResize.startWidth + resizeDelta);
+            const updatedColumnWidths = currentResize.initialWidths.map( (columnWidth, index) => {
+                return currentResize.columnIndex === index ? nextColumnWidth : columnWidth;
+            });
+            activeResizeRef.current = null;
+            const didUpdateWidths = setColumnWidthsAndRef(updatedColumnWidths, currentResize.columnIndex);
+            if(didUpdateWidths && name !== undefined){
+                updateSetting({setting_name: `${name}_column_widths`, value: updatedColumnWidths, broadcast: false});
+            }
+            setResizingColumnIndex(-1);
+            cleanupResizeListeners();
+        };
+        function handlePointerMove(pointerEvent){
+            pointerEvent.preventDefault();
+            applyResizeWidth(pointerEvent.clientX);
+        }
+        function handlePointerUp(pointerEvent){
+            pointerEvent.preventDefault();
+            finishResize(pointerEvent.clientX);
+        }
+        event.currentTarget.setPointerCapture?.(event.pointerId);
+        activeResizeRef.current = {
+            columnIndex,
+            initialWidths,
+            latestClientX: startClientX,
+            startClientX,
+            startWidth,
+        };
+        document.body.style.cursor = "col-resize";
+        document.body.style.userSelect = "none";
+        setResizingColumnIndex(columnIndex);
+        window.addEventListener("pointermove", handlePointerMove);
+        window.addEventListener("pointerup", handlePointerUp);
+        window.addEventListener("pointercancel", handlePointerUp);
+        cleanupResizeListenersRef.current = cleanupResizeListeners;
+    }, [columns, name, setColumnWidthsAndRef, updateSetting]);
+    useEffect(() => {
+        return () => {
+            cleanupResizeListenersRef.current?.();
+            activeResizeRef.current = null;
+            if(resizeFrameRef.current !== null){
+                window.cancelAnimationFrame(resizeFrameRef.current);
+                resizeFrameRef.current = null;
+            }
+        };
+    }, []);
+    const autosizeColumn =  useCallback( ({columnIndex}) => {
+        const column = columns[columnIndex];
+        if(column?.disableDoubleClick || column?.disableAutosize){
+            return
+        }
+        const currentColumnWidths = columnWidthsRef.current;
+        const updatedColumnWidths = currentColumnWidths.map((columnWidth, index) => {
+            if (columnIndex === index) {
+                return getAutosizedColumnWidth({column, columnIndex, headerNameKey, items});
+            }
+            return Math.floor(columnWidth);
+        });
+        const didUpdateWidths = setColumnWidthsAndRef(updatedColumnWidths, columnIndex);
+        if(didUpdateWidths){
+            if(name !== undefined){
+                updateSetting({setting_name: `${name}_column_widths`, value: updatedColumnWidths, broadcast: false});
+            }
+        }
+    }, [columns, headerNameKey, items, name, setColumnWidthsAndRef, updateSetting]);
+    const autosizeAllColumns = useCallback( () => {
+        const currentColumnWidths = columnWidthsRef.current;
+        const updatedColumnWidths = currentColumnWidths.map((columnWidth, columnIndex) => {
+            const column = columns[columnIndex];
+            if(column?.disableDoubleClick || column?.disableAutosize){
+                return Math.floor(columnWidth);
+            }
+            return getAutosizedColumnWidth({column, columnIndex, headerNameKey, items});
+        });
+        const didUpdateWidths = setColumnWidthsAndRef(updatedColumnWidths, 0);
+        if(didUpdateWidths && name !== undefined){
+            updateSetting({setting_name: `${name}_column_widths`, value: updatedColumnWidths, broadcast: false});
+        }
+    }, [columns, headerNameKey, items, name, setColumnWidthsAndRef, updateSetting]);
+    const resetColumnWidths = useCallback( () => {
+        const updatedColumnWidths = getInitialColumnWidths({
+            columns,
+            savedWidths: [],
+            totalWidth: AutoSizerProps.width - scrollbarWidth,
+        });
+        const didUpdateWidths = setColumnWidthsAndRef(updatedColumnWidths, 0);
+        if(didUpdateWidths && name !== undefined){
+            updateSetting({setting_name: `${name}_column_widths`, value: updatedColumnWidths, broadcast: false});
+        }
+    }, [AutoSizerProps.width, columns, name, scrollbarWidth, setColumnWidthsAndRef, updateSetting]);
+    const headerContextMenuOptions = React.useMemo( () => {
+        const sizingOptions = [
+            {
+                name: "Autosize Column",
+                type: "item",
+                icon: <FitScreenIcon style={headerMenuIconStyle} />,
+                disabled: ({columnIndex}) => columns[columnIndex]?.disableDoubleClick || columns[columnIndex]?.disableAutosize,
+                click: ({columnIndex}) => autosizeColumn({columnIndex}),
+            },
+            {
+                name: "Autosize All Columns",
+                type: "item",
+                icon: <ViewColumnIcon style={headerMenuIconStyle} />,
+                disabled: columns.every((column) => column?.disableDoubleClick || column?.disableAutosize),
+                click: () => autosizeAllColumns(),
+            },
+            {
+                name: "Reset Column Widths",
+                type: "item",
+                icon: <RestartAltIcon style={headerMenuIconStyle} />,
+                click: () => resetColumnWidths(),
+            },
+        ];
+        return [...sizingOptions, ...(contextMenuOptions || []).map(normalizeHeaderContextMenuOption)];
+    }, [autosizeAllColumns, autosizeColumn, columns, contextMenuOptions, resetColumnWidths]);
+
+    useEffect( () => {
+        if(callbackTableGridRef){
+            callbackTableGridRef.current = gridRef.current;
+        }
+    }, [gridRef.current])
+    const itemsWithHeader = [columns, ...items];
+    const headerCellData = {
+        "getRowHeight": getRowHeight,
+        "columns": columns,
+        "columnWidths": columnWidths,
+        "headerNameKey": headerNameKey,
+        "onClickHeader": onClickHeader,
+        "autosizeColumn": autosizeColumn,
+        "contextMenuOptions": headerContextMenuOptions,
+        "sortIndicatorIndex": sortIndicatorIndex,
+        "sortDirection": sortDirection,
+        "getColumnWidth": getColumnWidth,
+        "resizingColumnIndex": resizingColumnIndex,
+        "startColumnResize": startColumnResize,
+        "itemsWithHeader": itemsWithHeader,
+    };
+    return (
+        <>
+            <HeaderCellContext.Provider value={headerCellData}>
+                <VariableSizeGrid
+                    className={classes.grid}
+                    height={Math.max(1, AutoSizerProps.height)}
+                    width={AutoSizerProps.width}
+                    columnCount={columns.length}
+                    columnWidth={getColumnWidth}
+                    headerNameKey={headerNameKey}
+                    rowCount={itemsWithHeader.length}
+                    rowHeight={getRowHeight}
+                    itemData={{ items: itemsWithHeader,
+                        onDoubleClickRow, gridUUID,
+                        rowContextMenuOptions, onRowClick,
+                        onRowContextMenuClick}}
+                    innerElementType={innerElementType}
+                    overscanRowCount={20}
+                    useIsScrolling={false}
+                    ref={gridRef}>
+                    {CellRenderer}
+                </VariableSizeGrid>
+            </HeaderCellContext.Provider>
+
+        </>
+    );
+};
+
+const MythicResizableGrid = ({
+    columns,
+    sortIndicatorIndex,
+    sortDirection,
+    items,
+    onClickHeader,
+    headerNameKey,
+    onDoubleClickRow,
+    contextMenuOptions,
+    rowContextMenuOptions,
+    onRowContextMenuClick,
+    widthMeasureKey,
+    rowHeight = 20,
+    headerRowHeight = 20,
+    callbackTableGridRef,
+    onRowClick,
+    name,
+}) => {
+    return (
+        <div className={classes.root}>
+            <AutoSizer style={{height: "100%", width: "100%"}}>
+                {(AutoSizerProps) => (
+                    <ResizableGridWrapper
+                        name={name}
+                        columns={columns}
+                        callbackTableGridRef={callbackTableGridRef}
+                        headerNameKey={headerNameKey}
+                        sortIndicatorIndex={sortIndicatorIndex}
+                        sortDirection={sortDirection}
+                        items={items}
+                        widthMeasureKey={widthMeasureKey}
+                        rowHeight={rowHeight}
+                        headerRowHeight={headerRowHeight}
+                        onClickHeader={onClickHeader}
+                        onDoubleClickRow={onDoubleClickRow}
+                        contextMenuOptions={contextMenuOptions}
+                        rowContextMenuOptions={rowContextMenuOptions}
+                        onRowContextMenuClick={onRowContextMenuClick}
+                        onRowClick={onRowClick}
+                        {...AutoSizerProps}
+                    />
+                )}
+            </AutoSizer>
+        </div>
+    );
+};
+
+MythicResizableGrid.propTypes = {
+    columns: PropTypes.arrayOf(
+        PropTypes.shape({
+            name: PropTypes.string,
+            width: PropTypes.number,
+            disableAutosize: PropTypes.bool,
+            disableResize: PropTypes.bool,
+            disableSort: PropTypes.bool
+        })
+    ).isRequired,
+    sortIndicatorIndex: PropTypes.number,
+    sortDirection: PropTypes.oneOf(['ASC', 'DESC']),
+    items: PropTypes.arrayOf(PropTypes.array).isRequired,
+    onClickHeader: PropTypes.func,
+    onDoubleClickRow: PropTypes.func,
+    contextMenuOptions: PropTypes.array,
+    rowContextMenuOptions: PropTypes.array,
+    rowHeight: PropTypes.number,
+    headerRowHeight: PropTypes.number,
+    headerNameKey: PropTypes.string,
+    widthMeasureKey: PropTypes.string
+};
+
+export default MythicResizableGrid;

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/index.js

@@ -0,0 +1,3 @@
+import MythicResizableGrid from './MythicResizableGrid';
+
+export default MythicResizableGrid;

MythicReactUI/src/components/MythicComponents/MythicResizableGrid/styles.js

@@ -0,0 +1,24 @@
+const PREFIX = 'MythicResizableGrid';
+export const classes = {
+    root: `${PREFIX}-root flex-fill h-full min-h-0 min-w-0 overflow-hidden relative rounded w-full`,
+    grid: `${PREFIX}-grid`,
+    headerCellRow: `${PREFIX}-headerCellRow flex flex-row`,
+    headerCell: `${PREFIX}-headerCell cursor-pointer items-center flex justify-between min-w-0 overflow-hidden relative`,
+    headerCellNoSort: `${PREFIX}-headerCellNoSort`,
+    headerContent: `${PREFIX}-headerContent items-center flex gap-3 justify-between min-w-0 w-full`,
+    headerLabel: `${PREFIX}-headerLabel min-w-0 truncate`,
+    headerActions: `${PREFIX}-headerActions items-center inline-flex flex-none gap-2 min-w-0`,
+    headerIndicator: `${PREFIX}-headerIndicator items-center inline-flex flex-none justify-center rounded`,
+    headerFilterIcon: `${PREFIX}-headerFilterIcon cursor-pointer`,
+    headerSortIcon: `${PREFIX}-headerSortIcon`,
+    headerResizeHandle: `${PREFIX}-headerResizeHandle`,
+    headerResizeHandleActive: `${PREFIX}-headerResizeHandleActive`,
+    resizeGuide: `${PREFIX}-resizeGuide`,
+    hoveredRow: `${PREFIX}-hoveredRow`,
+    contextRow: `${PREFIX}-contextRow`,
+    rowFirstCell: `${PREFIX}-rowFirstCell`,
+    rowLastCell: `${PREFIX}-rowLastCell`,
+    rowInteractive: `${PREFIX}-rowInteractive`,
+    cell: `${PREFIX}-cell items-center flex min-w-0 relative truncate`,
+    cellInner: `${PREFIX}-cellInner items-center flex min-w-0 truncate w-full whitespace-nowrap`,
+}

MythicReactUI/src/components/MythicComponents/MythicSavedUserSetting.js

@@ -0,0 +1,105 @@
+import { useReactiveVar } from '@apollo/client';
+import {mePreferences, operatorSettingDefaults} from '../../cache';
+import React from 'react';
+import {useMutation, gql } from '@apollo/client';
+import {snackActions} from "../utilities/Snackbar";
+
+const updatePreferences = gql`
+mutation updatePreferences($preferences: jsonb!){
+    updateOperatorPreferences(preferences: $preferences){
+        status
+        error
+    }
+}
+`;
+export const GetComputedFontSize = () => {
+    const element = document.getElementById('root');
+    const fontSizeString = window.getComputedStyle(element).fontSize;
+    return parseFloat(fontSizeString);
+}
+let latestPreferenceSnapshot = null;
+const getPreferenceSnapshot = () => {
+    return latestPreferenceSnapshot || mePreferences() || {};
+};
+const areSettingValuesEqual = (first, second) => {
+    if(first === second){
+        return true;
+    }
+    if(typeof first !== "object" || typeof second !== "object" || first === null || second === null){
+        return false;
+    }
+    try{
+        return JSON.stringify(first) === JSON.stringify(second);
+    }catch(error){
+        return false;
+    }
+};
+/*
+setting_name options:
+    taskingDisplayFields
+    showMedia
+    interactType
+
+    callbacks_table_columns
+    callbacks_table_filters
+ */
+export function useGetMythicSetting({setting_name, default_value}){
+    const preferences = useReactiveVar(mePreferences);
+    let initialStorageSetting = GetMythicSetting({setting_name, default_value});
+
+    const [setting, setSetting] = React.useState(initialStorageSetting);
+
+    React.useEffect( () => {
+        let newSetting = GetMythicSetting({setting_name, default_value});
+        setSetting(newSetting);
+    }, [preferences?.[setting_name]]);
+
+    return setting;
+}
+export function GetMythicSetting({setting_name, default_value}){
+    const preferences = getPreferenceSnapshot();
+    return preferences?.[setting_name] === undefined ? default_value : preferences?.[setting_name];
+}
+export function useSetMythicSetting() {
+    const [updateSetting] = useMutation(updatePreferences, {
+        onCompleted: (data) => {
+            //console.log(data, mePreferences());
+        },
+        onError: (error) => {
+            snackActions.error("failed to save user setting: " + error.message);
+            console.log(error);
+        }
+    });
+    return [
+        ({setting_name, value, broadcast=true}) => {
+            const currentPreferences = getPreferenceSnapshot();
+            if(!areSettingValuesEqual(currentPreferences?.[setting_name], value)){
+                const updatedPreferences = {
+                    ...currentPreferences,
+                    [setting_name]: value,
+                };
+                latestPreferenceSnapshot = updatedPreferences;
+                if(broadcast){
+                    mePreferences(updatedPreferences);
+                }
+                updateSetting({variables: {preferences: updatedPreferences}});
+            }
+        },
+        ({settings, broadcast=true}) => {
+            const updatedPreferences = {
+                ...getPreferenceSnapshot(),
+                ...settings,
+            };
+            latestPreferenceSnapshot = updatedPreferences;
+            if(broadcast){
+                mePreferences(updatedPreferences);
+            }
+            updateSetting({variables: {preferences: updatedPreferences}});
+        },
+        () => {
+            latestPreferenceSnapshot = operatorSettingDefaults;
+            mePreferences(operatorSettingDefaults);
+            updateSetting({variables: {preferences: operatorSettingDefaults}});
+        }
+        ]
+}

MythicReactUI/src/components/MythicComponents/MythicSelectFromListDialog.js

@@ -0,0 +1,130 @@
+import React, {useRef, useEffect} from 'react';
+import {MythicActionButton} from './MythicActionButton';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import MenuItem from '@mui/material/MenuItem';
+import FormControl from '@mui/material/FormControl';
+import Select from '@mui/material/Select';
+import InputLabel from '@mui/material/InputLabel';
+import Input from '@mui/material/Input';
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+export function MythicSelectFromListDialog(props) {
+    const [options, setOptions] = React.useState([]);
+    const [selected, setSelected] = React.useState('');
+    const inputRef = useRef(null); 
+    const handleChange = (event) => {
+        setSelected(event.target.value);
+      };
+    const handleSubmit = () => {
+        props.onSubmit(selected);
+        if(props.dontCloseOnSubmit){
+          return;
+        }
+        props.onClose();
+    }
+    useEffect( () => {
+        //expects options to be an array of dictionaries with a "display" field for what gets presented to the user
+        const opts = [...props.options];
+        setOptions(opts);
+        if(opts.length > 0){
+            setSelected(opts[0]);
+        }else{
+            setSelected("");
+        }
+    }, [props.options]);
+  return (
+    <React.Fragment>
+        <DialogTitle >{props.title}</DialogTitle>
+        <DialogContent dividers={true}>
+            <React.Fragment>
+                <FormControl style={{width: "100%"}}>
+                  <InputLabel ref={inputRef}>Options</InputLabel>
+                  <Select
+                    labelId="demo-dialog-select-label"
+                    id="demo-dialog-select"
+                    value={selected}
+                    onChange={handleChange}
+                    input={<Input style={{width: "100%"}}/>}
+                  >
+                    <MenuItem value="">
+                      <em>None</em>
+                    </MenuItem>
+                    {options.map( (opt) => (
+                        <MenuItem value={opt} key={opt[props.identifier]}>{opt?.[props.display]}</MenuItem>
+                    ) )}
+                  </Select>
+                </FormControl>
+            </React.Fragment>
+        </DialogContent>
+        <DialogActions>
+          <MythicActionButton colorMode="always" onClick={props.onClose} tone="primary" variant="contained">
+            Close
+          </MythicActionButton>
+          <MythicActionButton colorMode="always" onClick={handleSubmit} tone="success" variant="contained">
+            {props.action}
+          </MythicActionButton>
+        </DialogActions>
+  </React.Fragment>
+  );
+}
+
+export function MythicSelectFromRawListDialog(props) {
+  const [options, setOptions] = React.useState([]);
+  const actionText = props.action || "Select";
+  const handleSubmit = (selected) => {
+      props.onSubmit(selected);
+      props.onClose();
+  }
+  const handleKeyDown = (event, selected) => {
+      if(event.key === "Enter" || event.key === " "){
+          event.preventDefault();
+          handleSubmit(selected);
+      }
+  }
+  useEffect( () => {
+      //expects options to be an array of dictionaries with a "display" field for what gets presented to the user
+      const opts = [...props.options];
+      setOptions(opts);
+  }, [props.options]);
+return (
+  <React.Fragment>
+      <DialogTitle >{props.title}</DialogTitle>
+      <DialogContent dividers={true} className="mythic-raw-select-dialog-content">
+          {options.length === 0 ? (
+              <Box className="mythic-raw-select-empty items-center flex justify-center text-muted text-center">
+                  <Typography variant="body2">No options available</Typography>
+              </Box>
+          ) : (
+              <Stack className="mythic-raw-select-list gap-4">
+                  {options.map( (choice, i) => (
+                      <Box
+                          key={String(choice) + i}
+                          className="mythic-raw-select-row items-center flex gap-6 justify-between min-w-0 w-full rounded cursor-pointer bg-surface-muted border-subtle text-primary"
+                          role="button"
+                          tabIndex={0}
+                          onClick={() => handleSubmit(choice)}
+                          onKeyDown={(event) => handleKeyDown(event, choice)}
+                      >
+                          <Typography className="mythic-raw-select-value min-w-0 truncate whitespace-nowrap" title={String(choice)}>
+                              {String(choice)}
+                          </Typography>
+                          <MythicActionButton className="mythic-raw-select-action" colorMode="always" tone="info" variant="outlined" size="small" tabIndex={-1}>
+                              {actionText}
+                          </MythicActionButton>
+                      </Box>
+                  ))}
+              </Stack>
+          )}
+      </DialogContent>
+      <DialogActions>
+        <MythicActionButton colorMode="always" onClick={props.onClose} tone="primary" variant="contained">
+          Close
+        </MythicActionButton>
+      </DialogActions>
+</React.Fragment>
+);
+}

MythicReactUI/src/components/MythicComponents/MythicSnackDownload.js

@@ -0,0 +1,86 @@
+import React from 'react';
+import { styled } from '@mui/material/styles';
+import Typography from '@mui/material/Typography';
+import {FileDownloadLinkWithAuth} from "../utilities/FileDownloadWithAuth";
+
+const PREFIX = 'MythicSnackDownload';
+
+const classes = {
+    root: `${PREFIX}-root`,
+    typography: `${PREFIX}-typography`,
+    actionRoot: `${PREFIX}-actionRoot`,
+    icons: `${PREFIX}-icons`,
+    expand: `${PREFIX}-expand`,
+    expandOpen: `${PREFIX}-expandOpen`,
+    collapse: `${PREFIX}-collapse`,
+    checkIcon: `${PREFIX}-checkIcon`,
+    button: `${PREFIX}-button`
+};
+
+const Root = styled('div')((
+    {
+        theme
+    }
+) => ({
+    [`& .${classes.root}`]: {
+        [theme.breakpoints.up('sm')]: {
+            minWidth: '344px !important',
+        },
+    },
+
+    [`& .${classes.typography}`]: {
+        fontWeight: 'bold',
+    },
+
+    [`& .${classes.actionRoot}`]: {
+        padding: '8px 8px 8px 16px',
+    },
+
+    [`& .${classes.icons}`]: {
+        marginLeft: 'auto',
+        float: "right"
+    },
+
+    [`& .${classes.expand}`]: {
+        padding: '8px 8px',
+        transform: 'rotate(0deg)',
+        transition: theme.transitions.create('transform', {
+            duration: theme.transitions.duration.shortest,
+        }),
+    },
+
+    [`& .${classes.expandOpen}`]: {
+        transform: 'rotate(180deg)',
+    },
+
+    [`& .${classes.collapse}`]: {
+        padding: 16,
+    },
+
+    [`& .${classes.checkIcon}`]: {
+        fontSize: 20,
+        color: theme.palette.text.secondary,
+        paddingRight: 4,
+    },
+
+    [`& .${classes.button}`]: {
+        padding: 0,
+        textTransform: 'none',
+    }
+}));
+
+export const MythicSnackDownload = (props) => {
+    return (
+        <Root>
+            <Typography variant="subtitle2" className={classes.typography}>
+                {props.title}
+            </Typography>
+                <React.Fragment>
+                    <Typography gutterBottom>File ready for download</Typography>
+                    <FileDownloadLinkWithAuth color="textPrimary" download={true} href={"/direct/download/" + props.file_id} target="_blank">
+                        Download here
+                    </FileDownloadLinkWithAuth>
+                </React.Fragment>
+        </Root>
+    );
+};

MythicReactUI/src/components/MythicComponents/MythicStateDisplay.js

@@ -0,0 +1,192 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import {MythicActionButton} from './MythicActionButton';
+import CircularProgress from '@mui/material/CircularProgress';
+import Skeleton from '@mui/material/Skeleton';
+import TableCell from '@mui/material/TableCell';
+import TableRow from '@mui/material/TableRow';
+import Typography from '@mui/material/Typography';
+import {alpha, useTheme} from '@mui/material/styles';
+import ErrorOutlineOutlinedIcon from '@mui/icons-material/ErrorOutlineOutlined';
+import HourglassEmptyOutlinedIcon from '@mui/icons-material/HourglassEmptyOutlined';
+import InboxOutlinedIcon from '@mui/icons-material/InboxOutlined';
+import SearchOffOutlinedIcon from '@mui/icons-material/SearchOffOutlined';
+
+const stateIcons = {
+    empty: <InboxOutlinedIcon />,
+    error: <ErrorOutlineOutlinedIcon />,
+    loading: <HourglassEmptyOutlinedIcon />,
+    search: <SearchOffOutlinedIcon />,
+};
+
+export function MythicStateDisplay({
+    action,
+    actionLabel,
+    compact = false,
+    description,
+    icon,
+    loading = false,
+    minHeight,
+    onAction,
+    severity = "empty",
+    sx = {},
+    title,
+}) {
+    const theme = useTheme();
+    const defaultIcon = stateIcons[severity] || stateIcons.empty;
+    const iconNode = loading ? (
+        <CircularProgress size={compact ? 18 : 22} color="inherit" disableShrink />
+    ) : React.cloneElement(icon || defaultIcon, {fontSize: compact ? "small" : "medium"});
+    const resolvedTitle = title || (loading ? "Loading" : "Nothing to show");
+    const resolvedMinHeight = minHeight || (compact ? 112 : 176);
+    return (
+        <Box sx={{
+            alignItems: "center",
+            color: theme.palette.text.secondary,
+            display: "flex",
+            justifyContent: "center",
+            minHeight: resolvedMinHeight,
+            p: compact ? 1.5 : 2.5,
+            width: "100%",
+            ...sx,
+        }}>
+            <Box sx={{
+                alignItems: "center",
+                display: "flex",
+                flexDirection: "column",
+                gap: compact ? 0.75 : 1,
+                maxWidth: compact ? 360 : 460,
+                textAlign: "center",
+            }}>
+                <Box sx={{
+                    alignItems: "center",
+                    backgroundColor: theme.palette.mode === "dark" ? alpha(theme.palette.common.white, 0.055) : alpha(theme.palette.common.black, 0.035),
+                    border: `1px solid ${theme.palette.mode === "dark" ? alpha(theme.palette.common.white, 0.09) : alpha(theme.palette.common.black, 0.08)}`,
+                    borderRadius: "6px",
+                    color: severity === "error" ? theme.palette.error.main : theme.palette.text.secondary,
+                    display: "inline-flex",
+                    height: compact ? 32 : 40,
+                    justifyContent: "center",
+                    width: compact ? 32 : 40,
+                }}>
+                    {iconNode}
+                </Box>
+                <Typography component="div" sx={{
+                    color: theme.palette.text.primary,
+                    fontSize: compact ? "0.86rem" : "0.95rem",
+                    fontWeight: 800,
+                    lineHeight: 1.25,
+                }}>
+                    {resolvedTitle}
+                </Typography>
+                {description &&
+                    <Typography component="div" sx={{
+                        color: theme.palette.text.secondary,
+                        fontSize: compact ? "0.76rem" : "0.82rem",
+                        lineHeight: 1.35,
+                    }}>
+                        {description}
+                    </Typography>
+                }
+                {action || (actionLabel && onAction) ? (
+                    action || (
+                        <MythicActionButton size="small" variant="outlined" onClick={onAction} sx={{mt: 0.5}}>
+                            {actionLabel}
+                        </MythicActionButton>
+                    )
+                ) : null}
+            </Box>
+        </Box>
+    );
+}
+
+export function MythicEmptyState(props) {
+    return <MythicStateDisplay severity="empty" {...props} />;
+}
+
+export function MythicSearchEmptyState(props) {
+    return <MythicStateDisplay severity="search" title="No results" {...props} />;
+}
+
+export function MythicLoadingState(props) {
+    return <MythicStateDisplay severity="loading" loading title="Loading" {...props} />;
+}
+
+export function MythicErrorState(props) {
+    return <MythicStateDisplay severity="error" title="Something went wrong" {...props} />;
+}
+
+export function MythicTableEmptyState({colSpan, ...props}) {
+    return (
+        <TableRow>
+            <TableCell colSpan={colSpan} sx={{borderBottom: 0, p: 0}}>
+                <MythicEmptyState {...props} />
+            </TableCell>
+        </TableRow>
+    );
+}
+
+export function MythicTableSearchEmptyState({colSpan, ...props}) {
+    return (
+        <TableRow>
+            <TableCell colSpan={colSpan} sx={{borderBottom: 0, p: 0}}>
+                <MythicSearchEmptyState {...props} />
+            </TableCell>
+        </TableRow>
+    );
+}
+
+export function MythicTableErrorState({colSpan, ...props}) {
+    return (
+        <TableRow>
+            <TableCell colSpan={colSpan} sx={{borderBottom: 0, p: 0}}>
+                <MythicErrorState {...props} />
+            </TableCell>
+        </TableRow>
+    );
+}
+
+export function MythicTableSkeletonRows({colSpan, columns = 4, rows = 4}) {
+    const skeletonColumns = Math.max(1, columns);
+    return (
+        <>
+            {[...Array(rows).keys()].map((rowIndex) => (
+                <TableRow key={`mythic-table-skeleton-${rowIndex}`}>
+                    <TableCell colSpan={colSpan} sx={{px: 1.25, py: 0.75}}>
+                        <Box sx={{
+                            display: "grid",
+                            gap: 1,
+                            gridTemplateColumns: `repeat(${skeletonColumns}, minmax(0, 1fr))`,
+                        }}>
+                            {[...Array(skeletonColumns).keys()].map((columnIndex) => (
+                                <Skeleton
+                                    animation="wave"
+                                    height={22}
+                                    key={`mythic-table-skeleton-${rowIndex}-${columnIndex}`}
+                                    sx={{borderRadius: 1}}
+                                    variant="rounded"
+                                    width={columnIndex === skeletonColumns - 1 ? "72%" : "100%"}
+                                />
+                            ))}
+                        </Box>
+                    </TableCell>
+                </TableRow>
+            ))}
+        </>
+    );
+}
+
+export function MythicTableLoadingState({colSpan, columns, rows = 4, showSkeleton = true, ...props}) {
+    return (
+        <>
+            <TableRow>
+                <TableCell colSpan={colSpan} sx={{borderBottom: showSkeleton ? undefined : 0, p: 0}}>
+                    <MythicLoadingState {...props} />
+                </TableCell>
+            </TableRow>
+            {showSkeleton &&
+                <MythicTableSkeletonRows colSpan={colSpan} columns={columns} rows={rows} />
+            }
+        </>
+    );
+}