326 lines
17 KiB
Plaintext
326 lines
17 KiB
Plaintext
<% content_for :title, "Network Ranges" %>
|
||
|
||
<div class="space-y-6">
|
||
<!-- Header -->
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<h1 class="text-3xl font-bold text-gray-900">Network Ranges</h1>
|
||
<p class="mt-2 text-gray-600">Browse and manage network ranges with intelligence data</p>
|
||
</div>
|
||
<div class="flex space-x-3">
|
||
<%= link_to "IP Lookup", lookup_network_ranges_path, class: "inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50" %>
|
||
<%= link_to "Add Range", new_network_range_path, class: "inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700" %>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Active Filters -->
|
||
<% if params[:asn].present? || params[:country].present? || params[:company].present? || params[:datacenter].present? || params[:vpn].present? || params[:proxy].present? || params[:source].present? || params[:search].present? %>
|
||
<div class="bg-blue-50 border border-blue-200 rounded-lg p-4">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<h3 class="text-sm font-medium text-blue-900">Active Filters</h3>
|
||
<div class="mt-2 flex flex-wrap gap-2">
|
||
<% if params[:asn].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
ASN: <%= params[:asn] %>
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:country].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Country: <%= params[:country] %>
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:company].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Company: <%= params[:company] %>
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:datacenter].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Datacenter
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:vpn].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
VPN
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:proxy].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Proxy
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:source].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Source: <%= params[:source] %>
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
<% if params[:search].present? %>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
Search: <%= params[:search] %>
|
||
<%= link_to "×", network_ranges_path, class: "ml-2 text-blue-600 hover:text-blue-800" %>
|
||
</span>
|
||
<% end %>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<%= link_to "Clear All", network_ranges_path, class: "text-sm text-blue-600 hover:text-blue-800 font-medium" %>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<% end %>
|
||
|
||
<!-- Statistics Cards -->
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4 mb-8">
|
||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||
<div class="p-5">
|
||
<div class="flex items-center">
|
||
<div class="flex-shrink-0">
|
||
<svg class="h-6 w-6 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4" />
|
||
</svg>
|
||
</div>
|
||
<div class="ml-5 w-0 flex-1">
|
||
<dl>
|
||
<dt class="text-sm font-medium text-gray-500 truncate">Total Ranges</dt>
|
||
<dd class="text-lg font-medium text-gray-900"><%= number_with_delimiter(@total_ranges) %></dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||
<div class="p-5">
|
||
<div class="flex items-center">
|
||
<div class="flex-shrink-0">
|
||
<svg class="h-6 w-6 text-green-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||
</svg>
|
||
</div>
|
||
<div class="ml-5 w-0 flex-1">
|
||
<dl>
|
||
<dt class="text-sm font-medium text-gray-500 truncate">With Intelligence</dt>
|
||
<dd class="text-lg font-medium text-gray-900"><%= number_with_delimiter(@ranges_with_intelligence) %></dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||
<div class="p-5">
|
||
<div class="flex items-center">
|
||
<div class="flex-shrink-0">
|
||
<svg class="h-6 w-6 text-orange-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.111 16.404a5.5 5.5 0 017.778 0M12 20h.01m-7.08-7.071c3.904-3.905 10.236-3.905 14.141 0M1.394 9.393c5.857-5.857 15.355-5.857 21.213 0" />
|
||
</svg>
|
||
</div>
|
||
<div class="ml-5 w-0 flex-1">
|
||
<dl>
|
||
<dt class="text-sm font-medium text-gray-500 truncate">Datacenters</dt>
|
||
<dd class="text-lg font-medium text-gray-900"><%= number_with_delimiter(@datacenter_ranges) %></dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||
<div class="p-5">
|
||
<div class="flex items-center">
|
||
<div class="flex-shrink-0">
|
||
<svg class="h-6 w-6 text-purple-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
||
</svg>
|
||
</div>
|
||
<div class="ml-5 w-0 flex-1">
|
||
<dl>
|
||
<dt class="text-sm font-medium text-gray-500 truncate">VPNs</dt>
|
||
<dd class="text-lg font-medium text-gray-900"><%= number_with_delimiter(@vpn_ranges) %></dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||
<div class="p-5">
|
||
<div class="flex items-center">
|
||
<div class="flex-shrink-0">
|
||
<svg class="h-6 w-6 text-red-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z" />
|
||
</svg>
|
||
</div>
|
||
<div class="ml-5 w-0 flex-1">
|
||
<dl>
|
||
<dt class="text-sm font-medium text-gray-500 truncate">Proxies</dt>
|
||
<dd class="text-lg font-medium text-gray-900"><%= number_with_delimiter(@proxy_ranges) %></dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Filters and Search -->
|
||
<div class="bg-white shadow rounded-lg mb-6">
|
||
<div class="p-4 border-b border-gray-200">
|
||
<h3 class="text-lg font-medium text-gray-900">Filters & Search</h3>
|
||
</div>
|
||
<div class="p-4">
|
||
<%= form_with url: network_ranges_path, method: :get, class: "space-y-4" do |form| %>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
||
<div>
|
||
<%= form.label :search, "Search", class: "block text-sm font-medium text-gray-700" %>
|
||
<%= form.text_field :search, value: params[:search], placeholder: "CIDR, Company, ASN...", class: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm" %>
|
||
</div>
|
||
|
||
<div>
|
||
<%= form.label :country, "Country", class: "block text-sm font-medium text-gray-700" %>
|
||
<%= form.select :country, options_for_select([["All Countries", ""]] + @top_countries.map { |c, _| [c, c] }), { selected: params[:country] }, { class: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm" } %>
|
||
</div>
|
||
|
||
<div>
|
||
<%= form.label :source, "Source", class: "block text-sm font-medium text-gray-700" %>
|
||
<%= form.select :source, options_for_select([["All Sources", ""], "production_import", "user_created", "api_imported", "manual", "auto:scanner_detected"], params[:source]), { }, { class: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm" } %>
|
||
</div>
|
||
|
||
<div>
|
||
<%= form.label :flags, "Flags", class: "block text-sm font-medium text-gray-700" %>
|
||
<div class="mt-2 space-x-4">
|
||
<label class="inline-flex items-center">
|
||
<%= check_box_tag "datacenter", "true", params[:datacenter] == "true", class: "rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50" %>
|
||
<span class="ml-2 text-sm text-gray-700">Datacenter</span>
|
||
</label>
|
||
<label class="inline-flex items-center">
|
||
<%= check_box_tag "vpn", "true", params[:vpn] == "true", class: "rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50" %>
|
||
<span class="ml-2 text-sm text-gray-700">VPN</span>
|
||
</label>
|
||
<label class="inline-flex items-center">
|
||
<%= check_box_tag "proxy", "true", params[:proxy] == "true", class: "rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50" %>
|
||
<span class="ml-2 text-sm text-gray-700">Proxy</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex justify-end">
|
||
<%= form.submit "Apply Filters", class: "inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700" %>
|
||
<%= link_to "Clear", network_ranges_path, class: "ml-3 inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50" %>
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Network Ranges Table -->
|
||
<div class="bg-white shadow overflow-hidden sm:rounded-md">
|
||
<div class="px-4 py-5 sm:px-6 border-b border-gray-200">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<h3 class="text-lg font-medium text-gray-900">Network Ranges</h3>
|
||
<p class="mt-1 text-sm text-gray-500">Showing <%= @network_ranges.count %> of <%= number_with_delimiter(@total_ranges) %> ranges</p>
|
||
</div>
|
||
<% if @pagy.present? && @pagy.pages > 1 %>
|
||
<span class="text-sm text-gray-500">
|
||
Page <%= @pagy.page %> of <%= @pagy.pages %>
|
||
</span>
|
||
<% end %>
|
||
</div>
|
||
<!-- Top Pagination -->
|
||
<% if @pagy.present? && @pagy.pages > 1 %>
|
||
<div class="mt-4">
|
||
<%= pagy_nav_tailwind(@pagy, pagy_id: 'network_ranges_top') %>
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
|
||
<ul class="divide-y divide-gray-200">
|
||
<% @network_ranges.each do |range| %>
|
||
<li class="hover:bg-gray-50">
|
||
<div class="px-4 py-4 sm:px-6">
|
||
<div class="flex items-center justify-between">
|
||
<div class="flex items-center space-x-4">
|
||
<div>
|
||
<div class="flex items-center space-x-2">
|
||
<span class="text-sm font-medium text-gray-900"><%= range.cidr %></span>
|
||
<% if range.ipv4? %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">IPv4</span>
|
||
<% else %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">IPv6</span>
|
||
<% end %>
|
||
</div>
|
||
|
||
<div class="mt-1 flex items-center space-x-4 text-sm text-gray-500">
|
||
<% if range.company.present? %>
|
||
<span><%= range.company %></span>
|
||
<% end %>
|
||
<% if range.asn.present? %>
|
||
<span>ASN <%= range.asn %></span>
|
||
<% end %>
|
||
<% if range.country.present? %>
|
||
<span class="flex items-center">
|
||
<svg class="w-4 h-4 mr-1" fill="currentColor" viewBox="0 0 20 20">
|
||
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd" />
|
||
</svg>
|
||
<%= range.country %>
|
||
</span>
|
||
<% end %>
|
||
<span class="text-gray-400">Source: <%= range.source %></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center space-x-2">
|
||
<% if range.is_datacenter? %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-orange-100 text-orange-800">DC</span>
|
||
<% end %>
|
||
<% if range.is_vpn? %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-purple-100 text-purple-800">VPN</span>
|
||
<% end %>
|
||
<% if range.is_proxy? %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800">Proxy</span>
|
||
<% end %>
|
||
|
||
<% if range.rules.any? %>
|
||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||
<%= range.rules.count %> rule<%= 's' if range.rules.count > 1 %>
|
||
</span>
|
||
<% end %>
|
||
|
||
<%= link_to "View", network_range_path(range), class: "text-blue-600 hover:text-blue-900 text-sm font-medium" %>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<% end %>
|
||
</ul>
|
||
|
||
<% if @network_ranges.empty? %>
|
||
<div class="text-center py-12">
|
||
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4" />
|
||
</svg>
|
||
<h3 class="mt-2 text-sm font-medium text-gray-900">No network ranges found</h3>
|
||
<p class="mt-1 text-sm text-gray-500">Get started by importing network data or creating ranges manually.</p>
|
||
<div class="mt-6">
|
||
<%= link_to "Add Network Range", new_network_range_path, class: "inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700" %>
|
||
</div>
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
|
||
<!-- Bottom Pagination -->
|
||
<% if @pagy.present? && @pagy.pages > 1 %>
|
||
<div class="mt-6">
|
||
<%= pagy_nav_tailwind(@pagy, pagy_id: 'network_ranges_bottom') %>
|
||
</div>
|
||
<% end %>
|
||
</div> |