mirror of
https://github.com/plausible/analytics.git
synced 2024-11-26 23:27:54 +03:00
Create unified template for settings
This commit is contained in:
Uku Taht
parent
d046773328
commit
b0bd564b56
@ -3,6 +3,7 @@ import "flatpickr/dist/flatpickr.min.css"
|
||||
import "./polyfills/closest"
|
||||
import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'
|
||||
import "phoenix_html"
|
||||
import 'alpinejs'
|
||||
|
||||
const triggers = document.querySelectorAll('[data-dropdown-trigger]')
|
||||
|
||||
@ -33,14 +34,6 @@ if (triggers.length > 0) {
|
||||
})
|
||||
}
|
||||
|
||||
const flash = document.getElementById('flash')
|
||||
|
||||
if (flash) {
|
||||
setTimeout(function() {
|
||||
flash.style.display = 'none'
|
||||
}, 2500)
|
||||
}
|
||||
|
||||
const registerForm = document.getElementById('register-form')
|
||||
|
||||
if (registerForm) {
|
||||
|
||||
7
assets/package-lock.json
generated
7
assets/package-lock.json
generated
@ -1410,6 +1410,11 @@
|
||||
"resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
|
||||
"integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
|
||||
},
|
||||
"alpinejs": {
|
||||
"version": "2.7.3",
|
||||
"resolved": "https://registry.npmjs.org/alpinejs/-/alpinejs-2.7.3.tgz",
|
||||
"integrity": "sha512-IRXnszk68s+FOGFMA1+K3rjLK44NqLShNpSy8aI6J3Ch9gss56FqlU6NVRP+mJes7LeQFCreH410luScVSkdfg=="
|
||||
},
|
||||
"ansi-regex": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
|
||||
@ -7113,7 +7118,7 @@
|
||||
},
|
||||
"pretty-hrtime": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
|
||||
"integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE="
|
||||
},
|
||||
"process": {
|
||||
|
||||
@ -12,6 +12,7 @@
|
||||
"@fullhuman/postcss-purgecss": "^2.3.0",
|
||||
"@tailwindcss/ui": "^0.1.4",
|
||||
"abortcontroller-polyfill": "^1.5.0",
|
||||
"alpinejs": "^2.7.3",
|
||||
"autoprefixer": "^9.8.6",
|
||||
"babel-loader": "^8.1.0",
|
||||
"chart.js": "^2.9.3",
|
||||
|
||||
@ -65,7 +65,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
{:ok, _} ->
|
||||
conn
|
||||
|> put_flash(:success, "Goal created succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/goals")
|
||||
|
||||
{:error, :goal, changeset, _} ->
|
||||
conn
|
||||
@ -83,7 +83,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Goal deleted succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(website)}/settings")
|
||||
|> redirect(to: "/#{URI.encode_www_form(website)}/settings/goals")
|
||||
end
|
||||
|
||||
def settings(conn, %{"website" => website}) do
|
||||
@ -93,29 +93,16 @@ defmodule PlausibleWeb.SiteController do
|
||||
def settings_general(conn, %{"website" => website}) do
|
||||
site =
|
||||
Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
|> Repo.preload(:google_auth)
|
||||
|> Repo.preload(:custom_domain)
|
||||
|
||||
search_console_domains =
|
||||
if site.google_auth do
|
||||
Plausible.Google.Api.fetch_verified_properties(site.google_auth)
|
||||
end
|
||||
|
||||
weekly_report = Repo.get_by(Plausible.Site.WeeklyReport, site_id: site.id)
|
||||
monthly_report = Repo.get_by(Plausible.Site.MonthlyReport, site_id: site.id)
|
||||
shared_links = Repo.all(from l in Plausible.Site.SharedLink, where: l.site_id == ^site.id)
|
||||
goals = Goals.for_site(site.domain)
|
||||
|
||||
conn
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings.html",
|
||||
|> render("settings_general.html",
|
||||
site: site,
|
||||
weekly_report: weekly_report,
|
||||
monthly_report: monthly_report,
|
||||
search_console_domains: search_console_domains,
|
||||
goals: goals,
|
||||
shared_links: shared_links,
|
||||
changeset: Plausible.Site.changeset(site, %{})
|
||||
changeset: Plausible.Site.changeset(site, %{}),
|
||||
layout: {PlausibleWeb.LayoutView, "site_settings.html"}
|
||||
)
|
||||
end
|
||||
|
||||
@ -127,10 +114,60 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings_goals.html",
|
||||
site: site,
|
||||
goals: goals
|
||||
goals: goals,
|
||||
layout: {PlausibleWeb.LayoutView, "site_settings.html"}
|
||||
)
|
||||
end
|
||||
|
||||
def settings_search_console(conn, %{"website" => website}) do
|
||||
site = Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
|> Repo.preload(:google_auth)
|
||||
|
||||
search_console_domains =
|
||||
if site.google_auth do
|
||||
Plausible.Google.Api.fetch_verified_properties(site.google_auth)
|
||||
end
|
||||
|
||||
conn
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings_search_console.html",
|
||||
site: site,
|
||||
search_console_domains: search_console_domains,
|
||||
layout: {PlausibleWeb.LayoutView, "site_settings.html"}
|
||||
)
|
||||
end
|
||||
|
||||
def settings_email_reports(conn, %{"website" => website}) do
|
||||
site = Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
|
||||
conn
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings_email_reports.html",
|
||||
site: site,
|
||||
weekly_report: Repo.get_by(Plausible.Site.WeeklyReport, site_id: site.id),
|
||||
monthly_report: Repo.get_by(Plausible.Site.MonthlyReport, site_id: site.id),
|
||||
layout: {PlausibleWeb.LayoutView, "site_settings.html"}
|
||||
)
|
||||
end
|
||||
|
||||
def settings_custom_domain(conn, %{"website" => website}) do
|
||||
site = Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
|> Repo.preload(:custom_domain)
|
||||
|
||||
conn
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings_custom_domain.html", site: site, layout: {PlausibleWeb.LayoutView, "site_settings.html"})
|
||||
end
|
||||
|
||||
def settings_snippet(conn, %{"website" => website}) do
|
||||
site = Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
|> Repo.preload(:custom_domain)
|
||||
|
||||
conn
|
||||
|> assign(:skip_plausible_tracking, true)
|
||||
|> render("settings_snippet.html", site: site, layout: {PlausibleWeb.LayoutView, "site_settings.html"})
|
||||
end
|
||||
|
||||
def update_google_auth(conn, %{"website" => website, "google_auth" => attrs}) do
|
||||
site =
|
||||
Sites.get_for_user!(conn.assigns[:current_user].id, website)
|
||||
@ -141,7 +178,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Google integration saved succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#google-auth")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/search-console")
|
||||
end
|
||||
|
||||
def delete_google_auth(conn, %{"website" => website}) do
|
||||
@ -152,8 +189,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
Repo.delete!(site.google_auth)
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Google account unlinked succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#google-auth")
|
||||
|> put_flash(:success, "Google account unlinked from Plausible")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/search-console")
|
||||
end
|
||||
|
||||
def update_settings(conn, %{"website" => website, "site" => site_params}) do
|
||||
@ -167,11 +204,11 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_session(site_session_key, nil)
|
||||
|> put_flash(:success, "Site settings saved succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> put_flash(:success, "Your site settings have been saved")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
|
||||
{:error, changeset} ->
|
||||
render("settings.html", site: site, changeset: changeset)
|
||||
render("settings_general.html", site: site, changeset: changeset)
|
||||
end
|
||||
end
|
||||
|
||||
@ -181,7 +218,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "#{site.domain} stats will be reset in a few minutes")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
end
|
||||
|
||||
def delete_site(conn, %{"website" => website}) do
|
||||
@ -210,8 +247,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> Repo.update!()
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Congrats! Stats for #{site.domain} are now public.")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> put_flash(:success, "Stats for #{site.domain} are now public.")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
end
|
||||
|
||||
def make_private(conn, %{"website" => website}) do
|
||||
@ -222,7 +259,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Stats for #{site.domain} are now private.")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
end
|
||||
|
||||
def enable_weekly_report(conn, %{"website" => website}) do
|
||||
@ -235,8 +272,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> Repo.insert!()
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Success! You will receive an email report every Monday going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "You will receive an email report every Monday going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def disable_weekly_report(conn, %{"website" => website}) do
|
||||
@ -244,8 +281,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
Repo.delete_all(from wr in Plausible.Site.WeeklyReport, where: wr.site_id == ^site.id)
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Success! You will not receive weekly email reports going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "You will not receive weekly email reports going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def add_weekly_report_recipient(conn, %{"website" => website, "recipient" => recipient}) do
|
||||
@ -256,8 +293,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> Repo.update!()
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Succesfully added #{recipient} as a recipient for the weekly report")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "Added #{recipient} as a recipient for the weekly report")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def remove_weekly_report_recipient(conn, %{"website" => website, "recipient" => recipient}) do
|
||||
@ -270,9 +307,9 @@ defmodule PlausibleWeb.SiteController do
|
||||
conn
|
||||
|> put_flash(
|
||||
:success,
|
||||
"Succesfully removed #{recipient} as a recipient for the weekly report"
|
||||
"Removed #{recipient} as a recipient for the weekly report"
|
||||
)
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def enable_monthly_report(conn, %{"website" => website}) do
|
||||
@ -285,8 +322,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> Repo.insert!()
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Success! You will receive an email report every month going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "You will receive an email report every month going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def disable_monthly_report(conn, %{"website" => website}) do
|
||||
@ -294,8 +331,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
Repo.delete_all(from mr in Plausible.Site.MonthlyReport, where: mr.site_id == ^site.id)
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Success! You will not receive monthly email reports going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "You will not receive monthly email reports going forward")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def add_monthly_report_recipient(conn, %{"website" => website, "recipient" => recipient}) do
|
||||
@ -306,8 +343,8 @@ defmodule PlausibleWeb.SiteController do
|
||||
|> Repo.update!()
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Succesfully added #{recipient} as a recipient for the monthly report")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> put_flash(:success, "Added #{recipient} as a recipient for the monthly report")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def remove_monthly_report_recipient(conn, %{"website" => website, "recipient" => recipient}) do
|
||||
@ -320,9 +357,9 @@ defmodule PlausibleWeb.SiteController do
|
||||
conn
|
||||
|> put_flash(
|
||||
:success,
|
||||
"Succesfully removed #{recipient} as a recipient for the monthly report"
|
||||
"Removed #{recipient} as a recipient for the monthly report"
|
||||
)
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings#email-reports")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/email-reports")
|
||||
end
|
||||
|
||||
def new_shared_link(conn, %{"website" => website}) do
|
||||
@ -352,7 +389,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
case Repo.insert(changes) do
|
||||
{:ok, _created} ->
|
||||
redirect(conn, to: "/#{URI.encode_www_form(site.domain)}/settings#visibility")
|
||||
redirect(conn, to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
|
||||
{:error, changeset} ->
|
||||
conn
|
||||
@ -371,7 +408,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
Repo.get_by(Plausible.Site.SharedLink, slug: slug)
|
||||
|> Repo.delete!()
|
||||
|
||||
redirect(conn, to: "/#{URI.encode_www_form(site.domain)}/settings#visibility")
|
||||
redirect(conn, to: "/#{URI.encode_www_form(site.domain)}/settings/general")
|
||||
end
|
||||
|
||||
def new_custom_domain(conn, %{"website" => website}) do
|
||||
@ -440,7 +477,7 @@ defmodule PlausibleWeb.SiteController do
|
||||
|
||||
conn
|
||||
|> put_flash(:success, "Custom domain deleted succesfully")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings")
|
||||
|> redirect(to: "/#{URI.encode_www_form(site.domain)}/settings/custom-domain")
|
||||
end
|
||||
|
||||
defp insert_site(user_id, params) do
|
||||
|
||||
@ -147,6 +147,10 @@ defmodule PlausibleWeb.Router do
|
||||
get "/:website/settings", SiteController, :settings
|
||||
get "/:website/settings/general", SiteController, :settings_general
|
||||
get "/:website/settings/goals", SiteController, :settings_goals
|
||||
get "/:website/settings/search-console", SiteController, :settings_search_console
|
||||
get "/:website/settings/email-reports", SiteController, :settings_email_reports
|
||||
get "/:website/settings/custom-domain", SiteController, :settings_custom_domain
|
||||
get "/:website/settings/js-snippet", SiteController, :settings_snippet
|
||||
get "/:website/goals/new", SiteController, :new_goal
|
||||
post "/:website/goals", SiteController, :create_goal
|
||||
delete "/:website/goals/:id", SiteController, :delete_goal
|
||||
|
||||
@ -124,5 +124,4 @@
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdn.paddle.com/paddle/paddle.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.0.1/dist/alpine.js" defer></script>
|
||||
<script>Paddle.Setup({vendor: 49430})</script>
|
||||
|
||||
@ -82,5 +82,4 @@
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdn.paddle.com/paddle/paddle.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.0.1/dist/alpine.js" defer></script>
|
||||
<script>Paddle.Setup({vendor: 49430})</script>
|
||||
|
||||
@ -128,5 +128,4 @@
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://cdn.paddle.com/paddle/paddle.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.0.1/dist/alpine.js" defer></script>
|
||||
<script>Paddle.Setup({vendor: 49430})</script>
|
||||
|
||||
34
lib/plausible_web/templates/layout/_flash.html.eex
Normal file
34
lib/plausible_web/templates/layout/_flash.html.eex
Normal file
@ -0,0 +1,34 @@
|
||||
<%= if get_flash(@conn, :success) do %>
|
||||
<div class="z-50 fixed inset-0 flex items-end justify-center px-4 py-6 pointer-events-none sm:p-6 sm:items-start sm:justify-end">
|
||||
<div x-data="{ show: true }" x-show="show" x-init="setTimeout(() => show = false, 4000)" x-transition:enter="transform ease-out duration-300 transition" x-transition:enter-start="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-2" x-transition:enter-end="translate-y-0 opacity-100 sm:translate-x-0" x-transition:leave="transition ease-in duration-100" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" class="max-w-sm w-full bg-white shadow-lg rounded-lg pointer-events-auto">
|
||||
<div class="rounded-lg shadow-xs overflow-hidden">
|
||||
<div class="p-4">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<!-- Heroicon name: check-circle -->
|
||||
<svg class="h-6 w-6 text-green-400" xmlns="http://www.w3.org/2000/svg" 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-3 w-0 flex-1 pt-0.5">
|
||||
<p class="text-sm leading-5 font-medium text-gray-900">
|
||||
<%= get_flash(@conn, :success_title) || "Success!" %>
|
||||
</p>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">
|
||||
<%= get_flash(@conn, :success) %>
|
||||
</p>
|
||||
</div>
|
||||
<div class="ml-4 flex-shrink-0 flex">
|
||||
<button class="inline-flex text-gray-400 focus:outline-none focus:text-gray-500 transition ease-in-out duration-150" @click="show = false">
|
||||
<!-- Heroicon name: x -->
|
||||
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
@ -1,4 +1,4 @@
|
||||
<div class="bg-gray-800">
|
||||
<div class="bg-gray-800 mt-12">
|
||||
<div class="container py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
|
||||
<div class="xl:grid xl:grid-cols-3 xl:gap-8">
|
||||
<div class="my-8 xl:my-0">
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<%= if @current_tab == @this_tab do %>
|
||||
<%= if is_current_tab(@conn, @this_tab) do %>
|
||||
<a href="/<%= URI.encode_www_form(@site.domain) %>/settings/<%= @this_tab %>" class="flex items-center px-3 py-2 text-sm leading-5 font-medium text-gray-900 rounded-md bg-gray-100 hover:text-gray-900 hover:bg-gray-100 focus:outline-none focus:bg-gray-200 transition ease-in-out duration-150 <%= if @this_tab != "general", do: "mt-1" %>"><%= @text %></a>
|
||||
<% else %>
|
||||
<a href="/<%= URI.encode_www_form(@site.domain) %>/settings/<%= @this_tab %>" class="flex items-center px-3 py-2 text-sm leading-5 font-medium text-gray-600 rounded-md hover:text-gray-900 hover:bg-gray-50 focus:outline-none focus:text-gray-900 focus:bg-gray-50 transition ease-in-out duration-150 <%= if @this_tab != "general", do: "mt-1" %>"><%= @text %></a>
|
||||
@ -80,11 +80,7 @@
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<%= if get_flash(@conn, :success) do %>
|
||||
<div id="flash" class="text-center bg-green-500 text-green-100 text-sm font-bold px-4 absolute w-full transition overflow-hidden" style="top: 91px" role="alert">
|
||||
<p class="py-3 "><%= get_flash(@conn, :success) %></p>
|
||||
</div>
|
||||
<% end %>
|
||||
<%= render("_flash.html", assigns) %>
|
||||
|
||||
<%= if get_flash(@conn, :error) do %>
|
||||
<div id="flash" class="text-center bg-red-dark-500 text-red-100 text-sm font-bold px-4 absolute w-full transition overflow-hidden" style="top: 91px" role="alert">
|
||||
@ -137,7 +133,7 @@
|
||||
<% end %>
|
||||
|
||||
<main class="flex-1">
|
||||
<%= render @view_module, @view_template, assigns %>
|
||||
<%= Map.get(assigns, :inner_layout) || render @view_module, @view_template, assigns %>
|
||||
</main>
|
||||
<%= render("_footer.html", assigns) %>
|
||||
<script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
|
||||
|
||||
41
lib/plausible_web/templates/layout/site_settings.html.eex
Normal file
41
lib/plausible_web/templates/layout/site_settings.html.eex
Normal file
@ -0,0 +1,41 @@
|
||||
<%= render_layout "app.html", assigns do %>
|
||||
<div class="container pt-6">
|
||||
<%= link("← Back to stats", to: "/#{URI.encode_www_form(@site.domain)}", class: "text-sm text-indigo-600 font-bold") %>
|
||||
<div class="pb-5 border-b border-gray-200">
|
||||
<h2 class="text-2xl font-bold leading-7 text-gray-900 sm:text-3xl sm:leading-9 sm:truncate">
|
||||
Settings for <%= @site.domain %>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="lg:grid lg:grid-cols-12 lg:gap-x-5 mt-6">
|
||||
<div class="py-6 px-2 sm:px-6 lg:py-0 lg:px-0 lg:col-span-3">
|
||||
<div class="lg:hidden">
|
||||
<select class="mt-1 form-select block w-full pl-3 pr-10 py-2 text-base leading-6 border-gray-300 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 sm:text-sm sm:leading-5 transition ease-in-out duration-150">
|
||||
<option selected>General</option>
|
||||
|
||||
<option>Password</option>
|
||||
|
||||
<option>Notifications</option>
|
||||
|
||||
<option>Plan</option>
|
||||
|
||||
<option>Billing</option>
|
||||
|
||||
<option>Team Members</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="hidden lg:block">
|
||||
<%= render("_settings_tab.html", this_tab: "general", text: "General", site: @site, conn: @conn) %>
|
||||
<%= render("_settings_tab.html", this_tab: "goals", text: "Goals", site: @site, conn: @conn) %>
|
||||
<%= render("_settings_tab.html", this_tab: "search-console", text: "Search Console", site: @site, conn: @conn) %>
|
||||
<%= render("_settings_tab.html", this_tab: "email-reports", text: "Email reports", site: @site, conn: @conn) %>
|
||||
<%= render("_settings_tab.html", this_tab: "custom-domain", text: "Custom domain", site: @site, conn: @conn) %>
|
||||
<%= render("_settings_tab.html", this_tab: "js-snippet", text: "JS snippet", site: @site, conn: @conn) %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6 sm:px-6 lg:px-0 lg:col-span-9">
|
||||
<%= render @view_module, @view_template, assigns %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
@ -1,395 +0,0 @@
|
||||
<div class="container">
|
||||
<div class="lg:grid lg:grid-cols-12 lg:gap-x-5 mt-6">
|
||||
<%= render("settings_header.html", tab: "general", site: @site) %>
|
||||
|
||||
<div class="space-y-6 sm:px-6 lg:px-0 lg:col-span-9">
|
||||
<%= form_for @changeset, "/#{URI.encode_www_form(@site.domain)}/settings", fn f -> %>
|
||||
<div class="shadow sm:rounded-md sm:overflow-hidden">
|
||||
<div class="bg-white py-6 px-4 space-y-6 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">General information</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Update your billing information. Please note that updating your location could affect your tax rates.</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-4 gap-6">
|
||||
<div class="col-span-4 sm:col-span-2">
|
||||
<%= label f, :domain, class: "block text-sm font-medium leading-5 text-gray-700" %>
|
||||
<%= text_input f, :domain, class: "form-input mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5", disabled: "disabled" %>
|
||||
</div>
|
||||
|
||||
<div class="col-span-4 sm:col-span-2">
|
||||
<%= label f, :timezone, "Reporting Timezone", class: "block text-sm font-medium leading-5 text-gray-700" %>
|
||||
<%= select f, :timezone, Plausible.Timezones.options(), class: "form-select mt-1 block w-full bg-white border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
|
||||
<span class="inline-flex rounded-md shadow-sm">
|
||||
<%= submit "Save", class: "bg-indigo-600 border border-transparent rounded-md py-2 px-4 inline-flex justify-center text-sm leading-5 font-medium text-white hover:bg-gray-700 focus:outline-none focus:border-gray-900 focus:shadow-outline-gray active:bg-gray-900 transition duration-150 ease-in-out" %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden mt-12 py-6 px-4 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Dashboard visibility</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Share your stats publicly or keep them private</p>
|
||||
</div>
|
||||
|
||||
<fieldset class="mt-6">
|
||||
<div class="bg-white rounded-md -space-y-px">
|
||||
<!-- On: "bg-indigo-50 border-indigo-200 z-10", Off: "border-gray-200" -->
|
||||
<div class="relative border rounded-tl-md rounded-tr-md p-4 flex">
|
||||
<div class="flex items-center h-5">
|
||||
<input id="settings-option-0" name="privacy_setting" type="radio" class="form-radio h-4 w-4 text-indigo-600 transition duration-150 ease-in-out cursor-pointer" checked>
|
||||
</div>
|
||||
<label for="settings-option-0" class="ml-3 flex flex-col cursor-pointer">
|
||||
<!-- On: "text-indigo-900", Off: "text-gray-900" -->
|
||||
<span class="block text-sm leading-5 font-medium">
|
||||
Public
|
||||
</span>
|
||||
<!-- On: "text-indigo-700", Off: "text-gray-500" -->
|
||||
<span class="block text-sm leading-5">
|
||||
Make your dashboard publicly accessible on <a class="text-indigo-600" target="_blank">https://plausible.io/plausible.io</a>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- On: "bg-indigo-50 border-indigo-200 z-10", Off: "border-gray-200" -->
|
||||
<div class="relative border border-gray-200 p-4 flex">
|
||||
<div class="flex items-center h-5">
|
||||
<input id="settings-option-1" name="privacy_setting" type="radio" class="form-radio h-4 w-4 text-indigo-600 transition duration-150 ease-in-out cursor-pointer">
|
||||
</div>
|
||||
<label for="settings-option-1" class="ml-3 flex flex-col cursor-pointer">
|
||||
<!-- On: "text-indigo-900", Off: "text-gray-900" -->
|
||||
<span class="block text-sm leading-5 font-medium">
|
||||
Private
|
||||
</span>
|
||||
<!-- On: "text-indigo-700", Off: "text-gray-500" -->
|
||||
<span class="block text-sm leading-5">
|
||||
Only you can see the dashboard
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
<div class="mt-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Shared links</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">You can share your stats privately by generating a shared link. The links are impossible to guess and you can add password protection for extra security.</p>
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
<%= for link <- @shared_links do %>
|
||||
<div class="flex relative w-full max-w-xl mt-2 text-sm">
|
||||
<input type="text" id="<%= link.slug %>" readonly="readonly" value="<%= shared_link_dest(link) %>" class="transition bg-gray-100 appearance-none border border-transparent rounded rounded-r-none w-full p-2 text-gray-700 appearance-none focus:outline-none focus:border-gray-300" />
|
||||
<button onclick="var input = document.getElementById('<%= link.slug %>'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="py-2 px-4 bg-gray-100 text-indigo-800 rounded-none border-r border-gray-300">
|
||||
<svg class="feather-sm" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</button>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/#{link.slug}", method: :delete, class: "py-2 px-4 bg-gray-100 text-red-600 rounded-l-none", data: [confirm: "Are you sure you want to delete this shared link? The stats will not be accessible with this link anymore."]) do %>
|
||||
<svg class="feather feather-sm" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= link("+ New link", to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/new", class: "button mt-4") %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sm:rounded-md sm:overflow-hidden mt-12 border border-red-400">
|
||||
<div class="bg-white py-6 px-4 space-y-6 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Danger zone</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Desctructive actions below can result in irrecoverable data loss. Be careful.</p>
|
||||
</div>
|
||||
<li class="py-4 flex items-center justify-between space-x-4">
|
||||
<div class="flex flex-col">
|
||||
<p class="text-sm leading-5 font-medium text-gray-900">
|
||||
Reset stats
|
||||
</p>
|
||||
<p class="text-sm leading-5 text-gray-500">
|
||||
Removes all pageviews but keeps the site configuration
|
||||
</p>
|
||||
</div>
|
||||
<%= link("Reset #{@site.domain} stats", to: "/#{URI.encode_www_form(@site.domain)}/stats", method: :delete, class: "inline-block px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", data: [confirm: "Resetting the stats cannot be reversed. Are you sure?"]) %>
|
||||
</li>
|
||||
<div class="border-b border-gray-200"></div>
|
||||
|
||||
<li class="py-4 flex items-center justify-between space-x-4">
|
||||
<div class="flex flex-col">
|
||||
<p class="text-sm leading-5 font-medium text-gray-900">
|
||||
Delete site
|
||||
</p>
|
||||
<p class="text-sm leading-5 text-gray-500">
|
||||
Removes all stats along with the site configuration
|
||||
</p>
|
||||
</div>
|
||||
<%= link "Delete #{@site.domain}", to: "/#{URI.encode_www_form(@site.domain)}", method: :delete, class: "inline-block px-4 py-2 border border-transparent font-medium rounded-md text-red-700 bg-red-100 hover:bg-red-50 focus:outline-none focus:border-red-300 focus:shadow-outline-red active:bg-red-200 transition ease-in-out duration-150 sm:text-sm sm:leading-5", data: [confirm: "Deleting the site data cannot be reversed. Are you sure?"] %>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pt-12"></div>
|
||||
<div class="max-w-xl mx-auto flex justify-between">
|
||||
<a href="/<%= URI.encode_www_form(@site.domain) %>"><h1 class="text-2xl font-black">Settings for <%= @site.domain %></h1></a>
|
||||
</div>
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mt-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="text-xl font-black">General</h2>
|
||||
</div>
|
||||
|
||||
<div class="my-4 border-b border-gray-200"></div>
|
||||
|
||||
<%= form_for @changeset, "/#{URI.encode_www_form(@site.domain)}/settings", [class: "max-w-xs"], fn f -> %>
|
||||
<div class="my-4">
|
||||
<%= label f, :domain, class: "block text-gray-700 text-sm font-bold mb-2" %>
|
||||
<%= text_input f, :domain, class: "transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 text-gray-700 leading-normal appearance-none focus:outline-none focus:border-gray-300 ", disabled: "disabled" %>
|
||||
<%= error_tag f, :domain %>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<%= label f, :timezone, "Reporting Timezone", class: "block text-gray-700 text-sm font-bold mb-2" %>
|
||||
<div class="inline-block relative w-full">
|
||||
<%= select f, :timezone, Plausible.Timezones.options(), class: "block appearance-none w-full bg-gray-100 text-gray-700 cursor-pointer hover:border-gray-500 p-2 pr-8 rounded leading-normal focus:outline-none" %>
|
||||
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-pink-500">
|
||||
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%= submit "Save changes", class: "button mt-4" %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mt-10" id="visibility">
|
||||
<h2 class="text-xl font-black">Visibility</h2>
|
||||
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
<%= if @site.public do %>
|
||||
Stats for <%= @site.domain %> are currently <b>public</b>. Anyone with the following link can view the stats:
|
||||
<div class="relative text-sm mt-4">
|
||||
<input type="text" id="public-link" value="<%= plausible_url() <> "/" <> URI.encode_www_form(@site.domain)%>" class="transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 pr-16 text-gray-700 appearance-none focus:outline-none" />
|
||||
<a onclick="var input = document.getElementById('public-link'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="absolute right-0 text-indigo-700 font-bold p-2">
|
||||
<svg class="feather-sm" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</a>
|
||||
</div>
|
||||
<%= button("Make stats private", to: "/sites/#{URI.encode_www_form(@site.domain)}/make-private", method: "POST", class: "button mt-8") %>
|
||||
<% else %>
|
||||
<div class="text-gray-700">
|
||||
Stats for <%= @site.domain %> are currently <b>private</b>. You are the only person who can see them.
|
||||
If you choose to make your stats public, anyone with the link will be able to view them.
|
||||
</div>
|
||||
<%= button("Make stats public", to: "/sites/#{URI.encode_www_form(@site.domain)}/make-public", method: "POST", class: "button mt-8") %>
|
||||
<% end %>
|
||||
|
||||
<div class="mt-12">
|
||||
<h2 class="text-xl font-black">Shared links</h2>
|
||||
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
|
||||
<div class="my-4">
|
||||
You can share your stats privately by generating a shared link. The links are impossible to guess and
|
||||
you can add password protection for extra security.
|
||||
</div>
|
||||
|
||||
<%= for link <- @shared_links do %>
|
||||
<div class="flex relative w-full mt-2 text-sm">
|
||||
<input type="text" id="<%= link.slug %>" readonly="readonly" value="<%= shared_link_dest(link) %>" class="transition bg-gray-100 appearance-none border border-transparent rounded rounded-r-none w-full p-2 text-gray-700 appearance-none focus:outline-none focus:border-gray-300" />
|
||||
<button onclick="var input = document.getElementById('<%= link.slug %>'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="py-2 px-4 bg-gray-100 text-indigo-800 rounded-none border-r border-gray-300">
|
||||
<svg class="feather-sm" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</button>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/#{link.slug}", method: :delete, class: "py-2 px-4 bg-gray-100 text-red-600 rounded-l-none", data: [confirm: "Are you sure you want to delete this shared link? The stats will not be accessible with this link anymore."]) do %>
|
||||
<svg class="feather feather-sm" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<%= link("+ New link", to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/new", class: "button mt-4") %>
|
||||
</div>
|
||||
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mt-10">
|
||||
<h2 class="text-xl font-black">Goals</h2>
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
<div>
|
||||
<%= if Enum.count(@goals) > 0 do %>
|
||||
<%= for goal <- @goals do %>
|
||||
<div class="border-b border-gray-300 py-3 flex justify-between">
|
||||
<small class="font-bold"><%= goal_name(goal) %></small>
|
||||
<%= button("❌", to: "/#{URI.encode_www_form(@site.domain)}/goals/#{goal.id}", method: :delete, class: "text-sm", data: [confirm: "Are you sure you want to remove goal #{goal_name(goal)}? This will just affect the UI, all of your analytics data will stay intact."]) %>
|
||||
</div>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<div>No goals configured for this site yet</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<%= link("+ Add goal", to: "/#{URI.encode_www_form(@site.domain)}/goals/new", class: "button mt-6") %>
|
||||
</div>
|
||||
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mt-10" id="google-auth">
|
||||
<h2 class="text-xl font-black">Google Integration</h2>
|
||||
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
<div class="text-gray-700 my-4">
|
||||
Integrating with your Google account allows Plausible to show more information about your websites' performance on their search engine.
|
||||
</div>
|
||||
|
||||
<%= if @site.google_auth do %>
|
||||
<div class="py-2"></div>
|
||||
<span class="text-gray-700">Linked Google account: <b><%= @site.google_auth.email %></b></span>
|
||||
|
||||
<%= link("Unlink Google account", to: "/#{URI.encode_www_form(@site.domain)}/settings/google", class: "inline-block mt-4 px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", method: "delete") %>
|
||||
|
||||
<%= case @search_console_domains do %>
|
||||
<% {:ok, domains} -> %>
|
||||
<%= if @site.google_auth.property && !(@site.google_auth.property in domains) do %>
|
||||
<p class="text-gray-700 mt-6 font-bold">
|
||||
NB: Your Google account does not have access to your currently configured property, <%= @site.google_auth.property %>. Please select a verified property from the list below.
|
||||
</p>
|
||||
<% else %>
|
||||
<p class="text-gray-700 mt-6">
|
||||
Select the Google Search Console property you would like to pull keyword data from. If you don't see your domain, <%= link("set it up and verify", to: "https://docs.plausible.io/google-search-console-integration", class: "text-indigo-500") %> on Search Console first.
|
||||
</p>
|
||||
<% end %>
|
||||
|
||||
<%= form_for Plausible.Site.GoogleAuth.changeset(@site.google_auth), "/#{URI.encode_www_form(@site.domain)}/settings/google", [class: "max-w-xs"], fn f -> %>
|
||||
<div class="my-6">
|
||||
<div class="inline-block relative w-full">
|
||||
<%= select f, :property, domains, prompt: "(Choose property)", class: "block appearance-none w-full bg-gray-100 text-gray-700 cursor-pointer hover:border-gray-500 p-2 pr-8 rounded leading-normal focus:outline-none" %>
|
||||
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-pink-500">
|
||||
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<%= submit "Save", class: "button" %>
|
||||
<% end %>
|
||||
<% {:error, error} -> %>
|
||||
<p class="text-gray-700 mt-6">The following error happened when fetching your Google Search Console domains.</p>
|
||||
<p class="text-red-700 font-medium mt-3"><%= error %></p>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button("Continue with Google", to: Plausible.Google.Api.authorize_url(@site.id), class: "button mt-4") %>
|
||||
|
||||
<div class="text-gray-700 mt-8">
|
||||
NB: You also need to set up your site on <%= link("Google Search Console", to: "https://search.google.com/search-console/about") %> for the integration to work. <%= link("Read the docs", to: "https://docs.plausible.io/google-search-console-integration", class: "text-indigo-500") %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mt-10" id="email-reports">
|
||||
<h2 class="text-xl font-black">Email reports</h2>
|
||||
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
|
||||
<div class="my-8 flex items-center">
|
||||
<%= if @weekly_report do %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/disable", method: :post, class: "border rounded-full border-gray-300 flex items-center cursor-pointer w-8 bg-green-500 justify-end") do %>
|
||||
<span class="rounded-full border w-4 h-4 border-gray-300 shadow-inner bg-white shadow"></span>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/enable", method: :post, class: "border rounded-full border-gray-300 flex items-center cursor-pointer w-8 justify-start") do %>
|
||||
<span class="rounded-full border w-4 h-4 border-gray-300 shadow-inner bg-white shadow"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<span class="ml-2">Send a weekly email report every Monday</span>
|
||||
</div>
|
||||
<%= if @weekly_report do %>
|
||||
<div class="text-sm text-gray-700 mt-6">
|
||||
<h4 class="font-bold my-2">Weekly report recipients</h4>
|
||||
<%= for recipient <- @weekly_report.recipients do %>
|
||||
<div class="p-2 flex justify-between bg-gray-100 rounded my-2 max-w-md">
|
||||
<span>
|
||||
<svg class="feather mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg><%= recipient %>
|
||||
</span>
|
||||
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients/#{recipient}", method: :delete) %>
|
||||
</div>
|
||||
<% end %>
|
||||
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients", fn f -> %>
|
||||
<div class="flex justify-between my-2 max-w-md">
|
||||
<%= email_input f, :recipient, class: "transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 text-gray-700 leading-normal appearance-none focus:outline-none focus:border-gray-300", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
||||
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="my-8 border-b border-gray-300"></div>
|
||||
<div class="my-8 flex items-center">
|
||||
<%= if @monthly_report do %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/disable", method: :post, class: "border rounded-full border-gray-300 flex items-center cursor-pointer w-8 bg-green-500 justify-end") do %>
|
||||
<span class="rounded-full border w-4 h-4 border-gray-300 shadow-inner bg-white shadow"></span>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/enable", method: :post, class: "border rounded-full border-gray-300 flex items-center cursor-pointer w-8 justify-start") do %>
|
||||
<span class="rounded-full border w-4 h-4 border-gray-300 shadow-inner bg-white shadow"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<span class="ml-2">Send a monthly email report on 1st of the month</span>
|
||||
</div>
|
||||
<%= if @monthly_report do %>
|
||||
<div class="text-sm text-gray-700 mt-6">
|
||||
<h4 class="font-bold my-2">Monthly report recipients</h4>
|
||||
<%= for recipient <- @monthly_report.recipients do %>
|
||||
<div class="p-2 flex justify-between bg-gray-100 rounded my-2 max-w-md">
|
||||
<span>
|
||||
<svg class="feather mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg><%= recipient %>
|
||||
</span>
|
||||
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients/#{recipient}", method: :delete) %>
|
||||
</div>
|
||||
<% end %>
|
||||
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients", fn f -> %>
|
||||
<div class="flex justify-between my-2 max-w-md">
|
||||
<%= email_input f, :recipient, class: "transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 text-gray-700 leading-normal appearance-none focus:outline-none focus:border-gray-300", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
||||
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="bg-white max-w-xl mx-auto shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mb-4 mt-16" id="custom-domain">
|
||||
<h2 class="text-xl font-black">Custom domain</h2>
|
||||
<div class="my-4">
|
||||
You can serve the tracking script from your domain name as a first-party resource instead of loading the script from <code>plausible.io</code>.
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<%= if @site.custom_domain do %>
|
||||
Configured domain: <b><%= @site.custom_domain.domain %></b>
|
||||
<%= link("Remove custom domain", to: "/sites/#{URI.encode_www_form(@site.domain)}/custom-domains/#{@site.custom_domain.id}", class: "inline-block mt-4 px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", method: "delete") %>
|
||||
<% else %>
|
||||
<%= link("Add custom domain", to: "/sites/#{URI.encode_www_form(@site.domain)}/custom-domains/new", class: "button") %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<%= form_for @conn, "/", [class: "bg-white max-w-xl mx-auto shadow-md rounded rounded-t-none border-t-2 border-indigo-100 px-8 pt-6 pb-8 mb-4 mt-16"], fn f -> %>
|
||||
<h2 class="text-xl font-black">Javascript snippet</h2>
|
||||
<div class="my-4">
|
||||
<p>Include this snippet in the <code><head></code> of your website.</p>
|
||||
<div class="relative">
|
||||
<%= textarea f, :domain, id: "snippet_code", class: "transition overflow-hidden bg-gray-100 appearance-none border border-transparent rounded w-full p-2 pr-6 text-gray-700 leading-normal appearance-none focus:outline-none focus:bg-white focus:border-gray-300 text-xs mt-2 resize-none", value: snippet(@site), rows: 2 %>
|
||||
<a onclick="var textarea = document.getElementById('snippet_code'); textarea.focus(); textarea.select(); document.execCommand('copy');" href="javascript:void(0)" class="no-underline text-indigo-500 text-sm hover:underline">
|
||||
<svg class="absolute text-indigo-500" style="top: 24px; right: 12px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="max-w-xl mx-auto bg-white shadow-md rounded rounded-t-none border-t-2 border-red-600 px-8 pt-6 pb-8 mt-16 mb-24">
|
||||
<h2 class="text-xl font-black">Danger zone</h2>
|
||||
|
||||
<div class="my-4 border-b border-gray-300"></div>
|
||||
|
||||
<p class="text-gray-700">Resetting the stats removes all pageviews but keeps the site configuration</p>
|
||||
<%= link("Reset #{@site.domain} stats", to: "/#{URI.encode_www_form(@site.domain)}/stats", method: :delete, class: "inline-block mt-4 px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", data: [confirm: "Resetting the stats cannot be reversed. Are you sure?"]) %>
|
||||
|
||||
<div class="mt-6">
|
||||
<p class="text-gray-700">Deleting the site removes all stats along with the site configuration</p>
|
||||
<%= link "Delete #{@site.domain}", to: "/#{URI.encode_www_form(@site.domain)}", method: :delete, class: "inline-block mt-4 px-4 py-2 border border-transparent font-medium rounded-md text-red-700 bg-red-100 hover:bg-red-50 focus:outline-none focus:border-red-300 focus:shadow-outline-red active:bg-red-200 transition ease-in-out duration-150 sm:text-sm sm:leading-5", data: [confirm: "Deleting the site data cannot be reversed. Are you sure?"] %>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,14 @@
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6">
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Custom domain</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Serve the tracking script from your domain name as a first-party resource instead of loading the script from our domain.</p>
|
||||
</header>
|
||||
<div class="mt-6">
|
||||
<%= if @site.custom_domain do %>
|
||||
Configured domain: <b><%= @site.custom_domain.domain %></b>
|
||||
<%= link("Remove custom domain", to: "/sites/#{URI.encode_www_form(@site.domain)}/custom-domains/#{@site.custom_domain.id}", class: "inline-block mt-4 px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", method: "delete") %>
|
||||
<% else %>
|
||||
<%= link("Add custom domain", to: "/sites/#{URI.encode_www_form(@site.domain)}/custom-domains/new", class: "button") %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,70 @@
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6">
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Email reports</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Send weekly/monthly analytics reports to as many addresses as you wish</p>
|
||||
</header>
|
||||
|
||||
<div class="my-8 flex items-center">
|
||||
<%= if @weekly_report do %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/disable", method: :post, class: "bg-indigo-600 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-5 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/enable", method: :post, class: "bg-gray-200 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-0 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<span class="ml-2">Send a weekly email report every Monday</span>
|
||||
</div>
|
||||
<%= if @weekly_report do %>
|
||||
<div class="text-sm text-gray-700 mt-6">
|
||||
<h4 class="font-bold my-2">Weekly report recipients</h4>
|
||||
<%= for recipient <- @weekly_report.recipients do %>
|
||||
<div class="p-2 flex justify-between bg-gray-100 rounded my-2 max-w-md">
|
||||
<span>
|
||||
<svg class="feather mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg><%= recipient %>
|
||||
</span>
|
||||
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients/#{recipient}", method: :delete) %>
|
||||
</div>
|
||||
<% end %>
|
||||
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/weekly-report/recipients", fn f -> %>
|
||||
<div class="flex justify-between my-2 max-w-md">
|
||||
<%= email_input f, :recipient, class: "transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 text-gray-700 leading-normal appearance-none focus:outline-none focus:border-gray-300", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
||||
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="my-8 border-b border-gray-300"></div>
|
||||
<div class="my-8 flex items-center">
|
||||
<%= if @monthly_report do %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/disable", method: :post, class: "bg-indigo-600 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-5 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/enable", method: :post, class: "bg-gray-200 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-0 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<span class="ml-2">Send a monthly email report on 1st of the month</span>
|
||||
</div>
|
||||
<%= if @monthly_report do %>
|
||||
<div class="text-sm text-gray-700 mt-6">
|
||||
<h4 class="font-bold my-2">Monthly report recipients</h4>
|
||||
<%= for recipient <- @monthly_report.recipients do %>
|
||||
<div class="p-2 flex justify-between bg-gray-100 rounded my-2 max-w-md">
|
||||
<span>
|
||||
<svg class="feather mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg><%= recipient %>
|
||||
</span>
|
||||
<%= button("❌", to: "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients/#{recipient}", method: :delete) %>
|
||||
</div>
|
||||
<% end %>
|
||||
<%= form_for @conn, "/sites/#{URI.encode_www_form(@site.domain)}/monthly-report/recipients", fn f -> %>
|
||||
<div class="flex justify-between my-2 max-w-md">
|
||||
<%= email_input f, :recipient, class: "transition bg-gray-100 appearance-none border border-transparent rounded w-full p-2 text-gray-700 leading-normal appearance-none focus:outline-none focus:border-gray-300", style: "flex-grow: 2", placeholder: "recipient@example.com" %>
|
||||
<%= submit "Add recipient", class: "button rounded-l-none whitespace-no-wrap" %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
106
lib/plausible_web/templates/site/settings_general.html.eex
Normal file
106
lib/plausible_web/templates/site/settings_general.html.eex
Normal file
@ -0,0 +1,106 @@
|
||||
<%= form_for @changeset, "/#{URI.encode_www_form(@site.domain)}/settings", fn f -> %>
|
||||
<div class="shadow sm:rounded-md sm:overflow-hidden">
|
||||
<div class="bg-white py-6 px-4 space-y-6 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">General information</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Update your billing information. Please note that updating your location could affect your tax rates.</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-4 gap-6">
|
||||
<div class="col-span-4 sm:col-span-2">
|
||||
<%= label f, :domain, class: "block text-sm font-medium leading-5 text-gray-700" %>
|
||||
<%= text_input f, :domain, class: "form-input mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5", disabled: "disabled" %>
|
||||
</div>
|
||||
|
||||
<div class="col-span-4 sm:col-span-2">
|
||||
<%= label f, :timezone, "Reporting Timezone", class: "block text-sm font-medium leading-5 text-gray-700" %>
|
||||
<%= select f, :timezone, Plausible.Timezones.options(), class: "form-select mt-1 block w-full bg-white border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
|
||||
<span class="inline-flex rounded-md shadow-sm">
|
||||
<%= submit "Save", class: "bg-indigo-600 border border-transparent rounded-md py-2 px-4 inline-flex justify-center text-sm leading-5 font-medium text-white hover:bg-gray-700 focus:outline-none focus:border-gray-900 focus:shadow-outline-gray active:bg-gray-900 transition duration-150 ease-in-out" %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden mt-12 py-6 px-4 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Dashboard visibility</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Share your stats publicly or keep them private</p>
|
||||
</div>
|
||||
|
||||
<%= if @site.public do %>
|
||||
<div class="flex items-center space-x-3 mt-4">
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/make-private", method: "POST", class: "bg-indigo-600 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-5 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<span class="text-sm leading-5 font-medium text-gray-900">Make stats publicly available on <a href="<%= plausible_url() <> "/" <> URI.encode_www_form(@site.domain)%>" class="text-indigo-500"><%= plausible_url() <> "/" <> URI.encode_www_form(@site.domain)%></a></span>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="flex items-center space-x-3 mt-4">
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/make-public", method: "POST", class: "bg-gray-200 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline") do %>
|
||||
<span class="translate-x-0 inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200"></span>
|
||||
<% end %>
|
||||
<span class="text-sm leading-5 font-medium text-gray-900">Make stats publicly available on <a href="<%= plausible_url() <> "/" <> URI.encode_www_form(@site.domain)%>" class="text-indigo-500"><%= plausible_url() <> "/" <> URI.encode_www_form(@site.domain)%></a></span>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="mt-8">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Shared links</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">You can share your stats privately by generating a shared link. The links are impossible to guess and you can add password protection for extra security.</p>
|
||||
</div>
|
||||
|
||||
<div class="mt-6">
|
||||
<%= for link <- @shared_links do %>
|
||||
<div class="flex relative w-full max-w-xl mt-2 text-sm">
|
||||
<input type="text" id="<%= link.slug %>" readonly="readonly" value="<%= shared_link_dest(link) %>" class="transition bg-gray-100 appearance-none border border-transparent rounded rounded-r-none w-full p-2 text-gray-700 appearance-none focus:outline-none focus:border-gray-300" />
|
||||
<button onclick="var input = document.getElementById('<%= link.slug %>'); input.focus(); input.select(); document.execCommand('copy');" href="javascript:void(0)" class="py-2 px-4 bg-gray-100 text-indigo-800 rounded-none border-r border-gray-300">
|
||||
<svg class="feather-sm" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</button>
|
||||
<%= button(to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/#{link.slug}", method: :delete, class: "py-2 px-4 bg-gray-100 text-red-600 rounded-l-none", data: [confirm: "Are you sure you want to delete this shared link? The stats will not be accessible with this link anymore."]) do %>
|
||||
<svg class="feather feather-sm" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= link("+ New link", to: "/sites/#{URI.encode_www_form(@site.domain)}/shared-links/new", class: "button mt-4") %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sm:rounded-md sm:overflow-hidden mt-12 border border-red-400">
|
||||
<div class="bg-white py-6 px-4 space-y-6 sm:p-6">
|
||||
<div>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Danger zone</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Desctructive actions below can result in irrecoverable data loss. Be careful.</p>
|
||||
</div>
|
||||
<li class="py-4 flex items-center justify-between space-x-4">
|
||||
<div class="flex flex-col">
|
||||
<p class="text-sm leading-5 font-medium text-gray-900">
|
||||
Reset stats
|
||||
</p>
|
||||
<p class="text-sm leading-5 text-gray-500">
|
||||
Removes all pageviews but keeps the site configuration
|
||||
</p>
|
||||
</div>
|
||||
<%= link("Reset #{@site.domain} stats", to: "/#{URI.encode_www_form(@site.domain)}/stats", method: :delete, class: "inline-block px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", data: [confirm: "Resetting the stats cannot be reversed. Are you sure?"]) %>
|
||||
</li>
|
||||
<div class="border-b border-gray-200"></div>
|
||||
|
||||
<li class="py-4 flex items-center justify-between space-x-4">
|
||||
<div class="flex flex-col">
|
||||
<p class="text-sm leading-5 font-medium text-gray-900">
|
||||
Delete site
|
||||
</p>
|
||||
<p class="text-sm leading-5 text-gray-500">
|
||||
Removes all stats along with the site configuration
|
||||
</p>
|
||||
</div>
|
||||
<%= link "Delete #{@site.domain}", to: "/#{URI.encode_www_form(@site.domain)}", method: :delete, class: "inline-block px-4 py-2 border border-transparent font-medium rounded-md text-red-700 bg-red-100 hover:bg-red-50 focus:outline-none focus:border-red-300 focus:shadow-outline-red active:bg-red-200 transition ease-in-out duration-150 sm:text-sm sm:leading-5", data: [confirm: "Deleting the site data cannot be reversed. Are you sure?"] %>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,31 +1,23 @@
|
||||
<div class="container">
|
||||
<div class="lg:grid lg:grid-cols-12 lg:gap-x-5 mt-6">
|
||||
<%= render("settings_header.html", tab: "goals", site: @site) %>
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6">
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Goals</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Define actions that you want your users to take like visiting a certain page, submitting a form, etc.</p>
|
||||
</header>
|
||||
|
||||
<div class="space-y-6 sm:px-6 lg:px-0 lg:col-span-9">
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6">
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Goals</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Define actions that you want your users to take like visiting a certain page, submitting a form, etc.</p>
|
||||
</header>
|
||||
|
||||
<%= if Enum.count(@goals) > 0 do %>
|
||||
<div class="mt-4">
|
||||
<%= for goal <- @goals do %>
|
||||
<div class="border-b border-gray-300 py-3 flex justify-between">
|
||||
<span class="text-sm font-medium text-gray-900"><%= goal_name(goal) %></span>
|
||||
<%= button(to: "/#{URI.encode_www_form(@site.domain)}/goals/#{goal.id}", method: :delete, class: "text-sm text-red-600", data: [confirm: "Are you sure you want to remove goal #{goal_name(goal)}? This will just affect the UI, all of your analytics data will stay intact."]) do %>
|
||||
<svg class="feather feather-sm" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="mt-4">No goals configured for this site yet</div>
|
||||
<% end %>
|
||||
|
||||
<%= link("+ Add goal", to: "/#{URI.encode_www_form(@site.domain)}/goals/new", class: "button mt-6") %>
|
||||
<%= if Enum.count(@goals) > 0 do %>
|
||||
<div class="mt-4">
|
||||
<%= for goal <- @goals do %>
|
||||
<div class="border-b border-gray-300 py-3 flex justify-between">
|
||||
<span class="text-sm font-medium text-gray-900"><%= goal_name(goal) %></span>
|
||||
<%= button(to: "/#{URI.encode_www_form(@site.domain)}/goals/#{goal.id}", method: :delete, class: "text-sm text-red-600", data: [confirm: "Are you sure you want to remove goal #{goal_name(goal)}? This will just affect the UI, all of your analytics data will stay intact."]) do %>
|
||||
<svg class="feather feather-sm" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="mt-4">No goals configured for this site yet</div>
|
||||
<% end %>
|
||||
|
||||
<%= link("+ Add goal", to: "/#{URI.encode_www_form(@site.domain)}/goals/new", class: "button mt-6") %>
|
||||
</div>
|
||||
|
||||
@ -0,0 +1,48 @@
|
||||
<div class="shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6">
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Google Search Console integration</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">You can integrate with Google Search Console to get all of your important search results stats such as keyword phrases people find your site with.</p>
|
||||
</header>
|
||||
|
||||
<%= if @site.google_auth do %>
|
||||
<div class="py-2"></div>
|
||||
<span class="text-gray-700">Linked Google account: <b><%= @site.google_auth.email %></b></span>
|
||||
|
||||
<%= link("Unlink Google account", to: "/#{URI.encode_www_form(@site.domain)}/settings/google", class: "inline-block mt-4 px-4 py-2 border border-gray-300 text-sm leading-5 font-medium rounded-md text-red-700 bg-white hover:text-red-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:text-red-800 active:bg-gray-50 transition ease-in-out duration-150", method: "delete") %>
|
||||
|
||||
<%= case @search_console_domains do %>
|
||||
<% {:ok, domains} -> %>
|
||||
<%= if @site.google_auth.property && !(@site.google_auth.property in domains) do %>
|
||||
<p class="text-gray-700 mt-6 font-bold">
|
||||
NB: Your Google account does not have access to your currently configured property, <%= @site.google_auth.property %>. Please select a verified property from the list below.
|
||||
</p>
|
||||
<% else %>
|
||||
<p class="text-gray-700 mt-6">
|
||||
Select the Google Search Console property you would like to pull keyword data from. If you don't see your domain, <%= link("set it up and verify", to: "https://docs.plausible.io/google-search-console-integration", class: "text-indigo-500") %> on Search Console first.
|
||||
</p>
|
||||
<% end %>
|
||||
|
||||
<%= form_for Plausible.Site.GoogleAuth.changeset(@site.google_auth), "/#{URI.encode_www_form(@site.domain)}/settings/google", [class: "max-w-xs"], fn f -> %>
|
||||
<div class="my-6">
|
||||
<div class="inline-block relative w-full">
|
||||
<%= select f, :property, domains, prompt: "(Choose property)", class: "block appearance-none w-full bg-gray-100 text-gray-700 cursor-pointer hover:border-gray-500 p-2 pr-8 rounded leading-normal focus:outline-none" %>
|
||||
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-pink-500">
|
||||
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<%= submit "Save", class: "button" %>
|
||||
<% end %>
|
||||
<% {:error, error} -> %>
|
||||
<p class="text-gray-700 mt-6">The following error happened when fetching your Google Search Console domains.</p>
|
||||
<p class="text-red-700 font-medium mt-3"><%= error %></p>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= button("Continue with Google", to: Plausible.Google.Api.authorize_url(@site.id), class: "button mt-8") %>
|
||||
|
||||
<div class="text-gray-700 mt-8">
|
||||
NB: You also need to set up your site on <%= link("Google Search Console", to: "https://search.google.com/search-console/about") %> for the integration to work. <%= link("Read the docs", to: "https://docs.plausible.io/google-search-console-integration", class: "text-indigo-500") %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
15
lib/plausible_web/templates/site/settings_snippet.html.eex
Normal file
15
lib/plausible_web/templates/site/settings_snippet.html.eex
Normal file
@ -0,0 +1,15 @@
|
||||
<%= form_for @conn, "/", [class: "shadow bg-white sm:rounded-md sm:overflow-hidden py-6 px-4 sm:p-6"], fn f -> %>
|
||||
<header>
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">Javascript snippet</h2>
|
||||
<p class="mt-1 text-sm leading-5 text-gray-500">Include this snippet in the <code><head></code> of your website.</p>
|
||||
</header>
|
||||
|
||||
<div class="my-4">
|
||||
<div class="relative">
|
||||
<%= textarea f, :domain, id: "snippet_code", class: "transition overflow-hidden bg-gray-100 appearance-none border border-transparent rounded w-full p-2 pr-6 text-gray-700 leading-normal appearance-none focus:outline-none focus:bg-white focus:border-gray-300 text-xs mt-2 resize-none", value: snippet(@site), rows: 2 %>
|
||||
<a onclick="var textarea = document.getElementById('snippet_code'); textarea.focus(); textarea.select(); document.execCommand('copy');" href="javascript:void(0)" class="no-underline text-indigo-500 text-sm hover:underline">
|
||||
<svg class="absolute text-indigo-500" style="top: 24px; right: 12px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
@ -36,4 +36,13 @@ defmodule PlausibleWeb.LayoutView do
|
||||
"Trial over, upgrade now"
|
||||
end
|
||||
end
|
||||
|
||||
@doc "http://blog.plataformatec.com.br/2018/05/nested-layouts-with-phoenix/"
|
||||
def render_layout(layout, assigns, do: content) do
|
||||
render(layout, Map.put(assigns, :inner_layout, content))
|
||||
end
|
||||
|
||||
def is_current_tab(conn, tab) do
|
||||
List.last(conn.path_info) == tab
|
||||
end
|
||||
end
|
||||
|
||||
Loading…
Reference in New Issue
Block a user