spring:
  boot:
    admin:
      ui:
        external-views:
          - label: "🚀" (1)
            url: "https://codecentric.de" (2)
            order: 2000 (3)

spring:
  boot:
    admin:
      ui:
        external-views:
          - label: Link w/o children
            children:
              - label: "📖 Docs"
                url: https://codecentric.github.io/spring-boot-admin/current/
              - label: "📦 Maven"
                url: https://search.maven.org/search?q=g:de.codecentric%20AND%20a:spring-boot-admin-starter-server
              - label: "🐙 GitHub"
                url: https://github.com/codecentric/spring-boot-admin

spring:
  boot:
    admin:
      ui:
        external-views:
          - label: Link w children
            url: https://codecentric.de  (1)
            children:
              - label: "📖 Docs"
                url: https://codecentric.github.io/spring-boot-admin/current/
              - label: "📦 Maven"
                url: https://search.maven.org/search?q=g:de.codecentric%20AND%20a:spring-boot-admin-starter-server
              - label: "🐙 GitHub"
                url: https://github.com/codecentric/spring-boot-admin
          - label: "🎅 Is it christmas"
            url: https://isitchristmas.com
            iframe: true

SBA.viewRegistry.setGroupIcon(
  "custom", (1)
  `<svg xmlns='http://www.w3.org/2000/svg'
        class='h-5  mr-3'
        viewBox='0 0 576 512'><path d='M512 80c8.8 0 16 7.2 16 16V416c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V96c0-8.8 7.2-16 16-16H512zM64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM200 208c14.2 0 27 6.1 35.8 16c8.8 9.9 24 10.7 33.9 1.9s10.7-24 1.9-33.9c-17.5-19.6-43.1-32-71.5-32c-53 0-96 43-96 96s43 96 96 96c28.4 0 54-12.4 71.5-32c8.8-9.9 8-25-1.9-33.9s-25-8-33.9 1.9c-8.8 9.9-21.6 16-35.8 16c-26.5 0-48-21.5-48-48s21.5-48 48-48zm144 48c0-26.5 21.5-48 48-48c14.2 0 27 6.1 35.8 16c8.8 9.9 24 10.7 33.9 1.9s10.7-24 1.9-33.9c-17.5-19.6-43.1-32-71.5-32c-53 0-96 43-96 96s43 96 96 96c28.4 0 54-12.4 71.5-32c8.8-9.9 8-25-1.9-33.9s-25-8-33.9 1.9c-8.8 9.9-21.6 16-35.8 16c-26.5 0-48-21.5-48-48z'/>
  </svg>` (2)
);

<template>
  <div class="m-4">
    <template v-for="application in applications" :key="application.name">
      <sba-panel :title="application.name">
        This application has the following instances:

        <ul>
          <template v-for="instance in application.instances">
            <li>
              <span class="mx-1" v-text="instance.registration.name"></span>

              <!-- SBA components are registered globally and can be used without importing them! -->
              <!-- They are defined in spring-boot-admin-server-ui -->
              <sba-status :status="instance.statusInfo.status" class="mx-1" />
              <sba-tag :value="instance.id" class="mx-1" label="id" />
            </li>
          </template>
        </ul>
      </sba-panel>
    </template>
    <pre v-text="applications"></pre>
  </div>
</template>

<script>
/* global SBA */
import "./custom.css";

export default {
  setup() {
    const { applications } = SBA.useApplicationStore(); (1)
    return {
      applications,
    };
  },
  methods: {
    stringify: JSON.stringify,
  },
};
</script>

<template>
  <div class="custom">
    <p>Instance: <span v-text="instance.id" /></p>
    <p>Output: <span v-html="text" /></p>
  </div>
</template>

<script>
export default {
  props: {
    instance: {
      (1)
      type: Object,
      required: true,
    },
  },
  data: () => ({
    text: "",
  }),
  async created() {
    console.log(this.instance);
    const response = await this.instance.axios.get("actuator/custom"); (2)
    this.text = response.data;
  },
};
</script>

<style lang="css" scoped>
.custom {
  font-size: 20px;
  width: 80%;
}
</style>

SBA.viewRegistry.addView({
  name: "instances/custom",
  parent: "instances", (1)
  path: "custom",
  component: customEndpoint,
  label: "Custom",
  group: "custom", (2)
  order: 1000,
  isEnabled: ({ instance }) => {
    return instance.hasEndpoint("custom");
  }, (3)
});