- help_live/index.ex: 2,642→173 lines, 15 section modules + sidebar extracted MikroTik now real section, dead if false removed - agent_channel.ex: 2,506→1,751 lines, 3 helper modules extracted (heartbeat/subscriptions/job_builder), decode_and_process/4 eliminates 8 repeated handle_in patterns, guard-based size checks - antenna_catalog.ex: 1,174→47 lines, 107 specs → priv/antennas/catalog.json - topology.ex: unbounded query → batched loading (100/batch), all guard errors fixed, zero if/case/cond conditionals - proto: decoder_macros.ex + field_specs.ex infrastructure for macro-generated protobuf decoders
221 lines
9.3 KiB
Elixir
221 lines
9.3 KiB
Elixir
defmodule ToweropsWeb.HelpLive.Sections.Sites do
|
|
@moduledoc false
|
|
use ToweropsWeb, :html
|
|
|
|
import ToweropsWeb.HelpLive.Sections.Helpers
|
|
|
|
def render(assigns) do
|
|
~H"""
|
|
<div class="p-6">
|
|
<h2 class="text-xl font-bold text-gray-900 dark:text-white mb-4">Sites</h2>
|
|
|
|
<div class="prose prose-sm dark:prose-invert max-w-none">
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
Sites are an optional organizational feature that lets you group devices by physical or logical
|
|
locations such as offices, datacenters, customer locations, or network zones. Sites are disabled
|
|
by default to keep things simple for single-location deployments.
|
|
</p>
|
|
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mt-6 mb-3">
|
|
When to Enable Sites
|
|
</h3>
|
|
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
Consider enabling sites if you:
|
|
</p>
|
|
|
|
<ul class="space-y-2 text-gray-600 dark:text-gray-400 list-disc list-inside mt-3">
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Manage multiple physical locations</strong>
|
|
- Offices, datacenters, retail stores, etc.
|
|
</li>
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Want to group credentials by location</strong>
|
|
- Different SNMP communities or credentials per site
|
|
</li>
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Need location-based monitoring</strong>
|
|
- Assign different remote pollers to different sites
|
|
</li>
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Organize by customer or department</strong>
|
|
- Logical groupings for multi-tenant or large networks
|
|
</li>
|
|
</ul>
|
|
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mt-6 mb-3">
|
|
When to Skip Sites
|
|
</h3>
|
|
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
You can skip enabling sites if you:
|
|
</p>
|
|
|
|
<ul class="space-y-2 text-gray-600 dark:text-gray-400 list-disc list-inside mt-3">
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Have a single location</strong>
|
|
- All devices in one office or datacenter
|
|
</li>
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Want a simpler setup</strong>
|
|
- Devices belong directly to your organization without extra grouping
|
|
</li>
|
|
<li>
|
|
<strong class="text-gray-900 dark:text-white">Don't need location-based credentials</strong>
|
|
- Organization-level credentials work for all devices
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="mt-6 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg">
|
|
<div class="flex gap-3">
|
|
<.icon
|
|
name="hero-information-circle"
|
|
class="h-5 w-5 text-blue-600 dark:text-blue-400 flex-shrink-0 mt-0.5"
|
|
/>
|
|
<div>
|
|
<h4 class="text-sm font-semibold text-blue-900 dark:text-blue-300 mb-1">Note</h4>
|
|
<p class="text-sm text-blue-800 dark:text-blue-300">
|
|
Sites are optional and disabled by default. You can start without sites and enable them
|
|
later if your needs change. When sites are disabled, all devices belong directly to
|
|
your organization.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mt-8 mb-3">How Sites Work</h3>
|
|
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
When sites are enabled, devices can be organized into sites, and credentials (SNMP communities,
|
|
usernames, passwords) can be set at three levels:
|
|
</p>
|
|
|
|
<div class="mt-4 space-y-3">
|
|
<div class="p-4 bg-gray-50 dark:bg-gray-800/50 border border-gray-200 dark:border-white/10 rounded-lg">
|
|
<h4 class="text-sm font-semibold text-gray-900 dark:text-white mb-2">
|
|
1. Organization Level
|
|
</h4>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400">
|
|
Default credentials that apply to all devices across all sites in your organization.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="p-4 bg-gray-50 dark:bg-gray-800/50 border border-gray-200 dark:border-white/10 rounded-lg">
|
|
<h4 class="text-sm font-semibold text-gray-900 dark:text-white mb-2">
|
|
2. Site Level (when sites enabled)
|
|
</h4>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400">
|
|
Override organization defaults for all devices at a specific site. Useful when different
|
|
locations have different network configurations.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="p-4 bg-gray-50 dark:bg-gray-800/50 border border-gray-200 dark:border-white/10 rounded-lg">
|
|
<h4 class="text-sm font-semibold text-gray-900 dark:text-white mb-2">3. Device Level</h4>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400">
|
|
Override organization or site credentials for a specific device. Useful for devices with
|
|
unique configurations.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mt-8 mb-3">Enabling Sites</h3>
|
|
|
|
<div class="space-y-4">
|
|
<div class="flex gap-4">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 font-semibold">
|
|
1
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<h4 class="text-base font-semibold text-gray-900 dark:text-white mb-2">
|
|
Navigate to Organization Settings
|
|
</h4>
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
Go to
|
|
<.code>Settings</.code>
|
|
→
|
|
<.code>Organization</.code>
|
|
and scroll to the "Site Organization" section.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex gap-4">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 font-semibold">
|
|
2
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<h4 class="text-base font-semibold text-gray-900 dark:text-white mb-2">
|
|
Enable the "Use Sites" Toggle
|
|
</h4>
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
Check the box for "Use sites to organize devices" and save your settings.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex gap-4">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 font-semibold">
|
|
3
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<h4 class="text-base font-semibold text-gray-900 dark:text-white mb-2">
|
|
Create Your First Site
|
|
</h4>
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
Navigate to
|
|
<.code>Sites</.code>
|
|
→
|
|
<.code>Add Site</.code>
|
|
to create your first site. Give it a descriptive name like "Main Office" or "Dallas Datacenter".
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex gap-4">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 font-semibold">
|
|
4
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<h4 class="text-base font-semibold text-gray-900 dark:text-white mb-2">
|
|
Assign Devices to Sites
|
|
</h4>
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
When creating or editing devices, you can now assign them to specific sites. The site
|
|
selector will appear in the device form.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-8 p-4 bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg">
|
|
<div class="flex gap-3">
|
|
<.icon
|
|
name="hero-exclamation-triangle"
|
|
class="h-5 w-5 text-yellow-600 dark:text-yellow-400 flex-shrink-0 mt-0.5"
|
|
/>
|
|
<div>
|
|
<h4 class="text-sm font-semibold text-yellow-900 dark:text-yellow-300 mb-1">
|
|
Disabling Sites
|
|
</h4>
|
|
<p class="text-sm text-yellow-800 dark:text-yellow-300">
|
|
If you disable sites after enabling them, all devices will be removed from their sites
|
|
and assigned directly to the organization. Site assignments will be lost, but devices
|
|
will remain in your organization and continue to be monitored.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
"""
|
|
end
|
|
end
|