<script setup lang="ts">
defineProps<{
  name: string;
}>();
</script>

<template>
  <svg
    class="admin-nav-icon"
    viewBox="0 0 24 24"
    fill="none"
    stroke="currentColor"
    stroke-width="1.75"
    stroke-linecap="round"
    stroke-linejoin="round"
    aria-hidden="true"
  >
    <template v-if="name === 'dashboard'">
      <rect x="3" y="3" width="7" height="9" rx="1" />
      <rect x="14" y="3" width="7" height="5" rx="1" />
      <rect x="14" y="12" width="7" height="9" rx="1" />
      <rect x="3" y="16" width="7" height="5" rx="1" />
    </template>

    <template v-else-if="name === 'matches'">
      <path d="M8 21h8" />
      <path d="M12 17v4" />
      <path d="M7 4h10v5a5 5 0 01-10 0V4z" />
      <path d="M5 4H3v2a3 3 0 003 3" />
      <path d="M19 4h2v2a3 3 0 01-3 3" />
    </template>

    <template v-else-if="name === 'users'">
      <circle cx="9" cy="8" r="3" />
      <path d="M3 20c0-3.3 2.7-6 6-6s6 2.7 6 6" />
      <circle cx="17" cy="9" r="2" />
      <path d="M14 20c0-2.2 1.8-4 4-4" />
    </template>

    <template v-else-if="name === 'finance'">
      <path d="M4 6h16M4 10h16M4 14h10" />
      <path d="M18 14l2 2 4-4" />
    </template>

    <template v-else-if="name === 'deposit'">
      <rect x="3" y="6" width="18" height="13" rx="2" />
      <path d="M3 10h18" />
      <path d="M7 15h4" />
    </template>

    <template v-else-if="name === 'cashback'">
      <circle cx="12" cy="12" r="8" />
      <path d="M12 8v4l2.5 2.5" />
    </template>

    <template v-else-if="name === 'bets'">
      <path d="M8 4h8l2 4v12a2 2 0 01-2 2H8a2 2 0 01-2-2V4z" />
      <path d="M8 8h8M8 12h6M8 16h4" />
    </template>

    <template v-else-if="name === 'contents'">
      <circle cx="12" cy="12" r="3" />
      <path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4" />
    </template>

    <template v-else-if="name === 'media'">
      <rect x="3" y="5" width="18" height="14" rx="2" />
      <circle cx="9" cy="11" r="2" />
      <path d="M21 15l-4.5-4.5L7 19" />
    </template>

    <template v-else-if="name === 'audit'">
      <path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2" />
      <rect x="9" y="3" width="6" height="4" rx="1" />
      <path d="M9 12h6M9 16h4" />
    </template>

    <template v-else-if="name === 'smoke-tests'">
      <path d="M9 3h6l1 7H8L9 3z" />
      <path d="M10 10v8M14 10v8" />
      <path d="M8 18h8" />
      <circle cx="12" cy="7" r="1" fill="currentColor" stroke="none" />
    </template>

    <template v-else>
      <circle cx="12" cy="12" r="8" />
    </template>
  </svg>
</template>

<style scoped>
.admin-nav-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
</style>
