Merge pull request #319 from bokub/feature/favicon

Add favicon to websites
This commit is contained in:
Mike Cao 2020-10-21 15:53:48 -07:00 committed by GitHub
commit 8021d9d3fa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 151 additions and 114 deletions

View File

@ -0,0 +1,21 @@
import React from 'react';
import styles from './Favicon.module.css';
function getHostName(url) {
const match = url.match(/^(?:https?:\/\/)?(?:[^@\n]+@)?(?:www\.)?([^:/\n?=]+)/im);
return match && match.length > 1 ? match[1] : null;
}
export default function Favicon({ domain, ...props }) {
const hostName = domain ? getHostName(domain) : null;
return hostName ? (
<img
className={styles.favicon}
src={`https://icons.duckduckgo.com/ip3/${hostName}.ico`}
height="16"
alt=""
{...props}
/>
) : null;
}

View File

@ -0,0 +1,3 @@
.favicon {
margin-right: 8px;
}

View File

@ -20,6 +20,7 @@ import { TOKEN_HEADER } from '../../lib/constants';
export default function WebsiteChart({ export default function WebsiteChart({
websiteId, websiteId,
title, title,
domain,
stickyHeader = false, stickyHeader = false,
showLink = false, showLink = false,
onDataLoad = () => {}, onDataLoad = () => {},
@ -66,7 +67,7 @@ export default function WebsiteChart({
return ( return (
<div className={styles.container}> <div className={styles.container}>
<WebsiteHeader websiteId={websiteId} title={title} showLink={showLink} /> <WebsiteHeader websiteId={websiteId} title={title} domain={domain} showLink={showLink} />
<div className={classNames(styles.header, 'row')}> <div className={classNames(styles.header, 'row')}>
<StickyHeader <StickyHeader
className={classNames(styles.metrics, 'col row')} className={classNames(styles.metrics, 'col row')}

View File

@ -4,14 +4,18 @@ import Link from 'components/common/Link';
import PageHeader from 'components/layout/PageHeader'; import PageHeader from 'components/layout/PageHeader';
import RefreshButton from 'components/common/RefreshButton'; import RefreshButton from 'components/common/RefreshButton';
import ButtonLayout from 'components/layout/ButtonLayout'; import ButtonLayout from 'components/layout/ButtonLayout';
import Favicon from 'components/common/Favicon';
import ActiveUsers from './ActiveUsers'; import ActiveUsers from './ActiveUsers';
import Arrow from 'assets/arrow-right.svg'; import Arrow from 'assets/arrow-right.svg';
import styles from './WebsiteHeader.module.css'; import styles from './WebsiteHeader.module.css';
export default function WebsiteHeader({ websiteId, title, showLink = false }) { export default function WebsiteHeader({ websiteId, title, domain, showLink = false }) {
return ( return (
<PageHeader> <PageHeader>
<div className={styles.title}>{title}</div> <div className={styles.title}>
<Favicon domain={domain} />
{title}
</div>
<ActiveUsers className={styles.active} websiteId={websiteId} /> <ActiveUsers className={styles.active} websiteId={websiteId} />
<ButtonLayout align="right"> <ButtonLayout align="right">
<RefreshButton websiteId={websiteId} /> <RefreshButton websiteId={websiteId} />

View File

@ -82,7 +82,12 @@ export default function TestConsole() {
</div> </div>
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">
<WebsiteChart websiteId={website.website_id} title={website.name} showLink /> <WebsiteChart
websiteId={website.website_id}
title={website.name}
domain={website.domain}
showLink
/>
<PageHeader>Events</PageHeader> <PageHeader>Events</PageHeader>
<EventsChart websiteId={website.website_id} /> <EventsChart websiteId={website.website_id} />
</div> </div>

View File

@ -120,6 +120,7 @@ export default function WebsiteDetails({ websiteId }) {
<WebsiteChart <WebsiteChart
websiteId={websiteId} websiteId={websiteId}
title={data.name} title={data.name}
domain={data.domain}
onDataLoad={handleDataLoad} onDataLoad={handleDataLoad}
showLink={false} showLink={false}
stickyHeader stickyHeader

View File

@ -17,9 +17,9 @@ export default function WebsiteList({ userId }) {
return ( return (
<Page> <Page>
{data.map(({ website_id, name }) => ( {data.map(({ website_id, name, domain }) => (
<div key={website_id} className={styles.website}> <div key={website_id} className={styles.website}>
<WebsiteChart websiteId={website_id} title={name} showLink /> <WebsiteChart websiteId={website_id} title={name} domain={domain} showLink />
</div> </div>
))} ))}
{data.length === 0 && ( {data.length === 0 && (

View File

@ -13,6 +13,7 @@ import ShareUrlForm from 'components/forms/ShareUrlForm';
import EmptyPlaceholder from 'components/common/EmptyPlaceholder'; import EmptyPlaceholder from 'components/common/EmptyPlaceholder';
import ButtonLayout from 'components/layout/ButtonLayout'; import ButtonLayout from 'components/layout/ButtonLayout';
import Toast from 'components/common/Toast'; import Toast from 'components/common/Toast';
import Favicon from 'components/common/Favicon';
import Pen from 'assets/pen.svg'; import Pen from 'assets/pen.svg';
import Trash from 'assets/trash.svg'; import Trash from 'assets/trash.svg';
import Plus from 'assets/plus.svg'; import Plus from 'assets/plus.svg';
@ -60,8 +61,9 @@ export default function WebsiteSettings() {
</ButtonLayout> </ButtonLayout>
); );
const DetailsLink = ({ website_id, name }) => ( const DetailsLink = ({ website_id, name, domain }) => (
<Link href="/website/[...id]" as={`/website/${website_id}/${name}`}> <Link href="/website/[...id]" as={`/website/${website_id}/${name}`}>
<Favicon domain={domain} />
{name} {name}
</Link> </Link>
); );

View File

@ -3,8 +3,8 @@
"label.add-account": "Tambah akun", "label.add-account": "Tambah akun",
"label.add-website": "Tambah situs web", "label.add-website": "Tambah situs web",
"label.administrator": "Pengelola", "label.administrator": "Pengelola",
"label.all": "All", "label.all": "Semua",
"label.all-websites": "All websites", "label.all-websites": "Semua website",
"label.back": "Kembali", "label.back": "Kembali",
"label.cancel": "Batal", "label.cancel": "Batal",
"label.change-password": "Ganti kata sandi", "label.change-password": "Ganti kata sandi",
@ -14,7 +14,7 @@
"label.custom-range": "Rentang khusus", "label.custom-range": "Rentang khusus",
"label.dashboard": "Dasbor", "label.dashboard": "Dasbor",
"label.date-range": "Rentang tanggal", "label.date-range": "Rentang tanggal",
"label.default-date-range": "Rentang tanggal default", "label.default-date-range": "Rentang tanggal bawaan",
"label.delete": "Hapus", "label.delete": "Hapus",
"label.delete-account": "Hapus akun", "label.delete-account": "Hapus akun",
"label.delete-website": "Hapus situs web", "label.delete-website": "Hapus situs web",
@ -37,8 +37,8 @@
"label.password": "Kata sandi", "label.password": "Kata sandi",
"label.passwords-dont-match": "Kata sandi tidak cocok", "label.passwords-dont-match": "Kata sandi tidak cocok",
"label.profile": "Profil", "label.profile": "Profil",
"label.realtime": "Realtime", "label.realtime": "Waktu nyata",
"label.realtime-logs": "Realtime logs", "label.realtime-logs": "Log waktu nyata",
"label.refresh": "Segarkan", "label.refresh": "Segarkan",
"label.required": "Wajib", "label.required": "Wajib",
"label.reset": "Atur ulang", "label.reset": "Atur ulang",
@ -65,7 +65,7 @@
"message.get-tracking-code": "Dapatkan kode pelacakan", "message.get-tracking-code": "Dapatkan kode pelacakan",
"message.go-to-settings": "Pergi ke pengaturan", "message.go-to-settings": "Pergi ke pengaturan",
"message.incorrect-username-password": "Nama pengguna/kata sandi salah.", "message.incorrect-username-password": "Nama pengguna/kata sandi salah.",
"message.log.visitor": "Visitor from {country} using {browser} on {os} {device}", "message.log.visitor": "Pengunjung dari {country} dengan {browser} di {device} {os}",
"message.new-version-available": "Versi terbaru umami {version} telah tersedia!", "message.new-version-available": "Versi terbaru umami {version} telah tersedia!",
"message.no-data-available": "Tidak ada data.", "message.no-data-available": "Tidak ada data.",
"message.no-websites-configured": "Anda tidak memiliki situs web yang dikonfigurasi.", "message.no-websites-configured": "Anda tidak memiliki situs web yang dikonfigurasi.",
@ -77,8 +77,8 @@
"message.type-delete": "Ketikkan {delete} pada kotak di bawah untuk konfirmasi.", "message.type-delete": "Ketikkan {delete} pada kotak di bawah untuk konfirmasi.",
"metrics.actions": "Aksi", "metrics.actions": "Aksi",
"metrics.average-visit-time": "Waktu kunjungan rata-rata", "metrics.average-visit-time": "Waktu kunjungan rata-rata",
"metrics.bounce-rate": "Tingkat bouncing", "metrics.bounce-rate": "Rasio pentalan",
"metrics.browsers": "Browser", "metrics.browsers": "Peramban",
"metrics.countries": "Negara", "metrics.countries": "Negara",
"metrics.device.desktop": "Desktop", "metrics.device.desktop": "Desktop",
"metrics.device.laptop": "Laptop", "metrics.device.laptop": "Laptop",
@ -88,7 +88,7 @@
"metrics.events": "Perihal", "metrics.events": "Perihal",
"metrics.filter.combined": "Gabungan", "metrics.filter.combined": "Gabungan",
"metrics.filter.domain-only": "Hanya domain", "metrics.filter.domain-only": "Hanya domain",
"metrics.filter.raw": "Raw", "metrics.filter.raw": "Mentah",
"metrics.operating-systems": "Sistem Operasi", "metrics.operating-systems": "Sistem Operasi",
"metrics.page-views": "Tampilan halaman", "metrics.page-views": "Tampilan halaman",
"metrics.pages": "Halaman", "metrics.pages": "Halaman",

View File

@ -1,99 +1,99 @@
{ {
"label.accounts": "账户", "label.accounts": "账户",
"label.add-account": "添加账户", "label.add-account": "添加账户",
"label.add-website": "添加网站", "label.add-website": "添加网站",
"label.administrator": "管理员", "label.administrator": "管理员",
"label.all": "All", "label.all": "所有",
"label.all-websites": "All websites", "label.all-websites": "全部网站",
"label.back": "返回", "label.back": "返回",
"label.cancel": "取消", "label.cancel": "取消",
"label.change-password": "更新密码", "label.change-password": "更新密码",
"label.confirm-password": "确认密码", "label.confirm-password": "确认密码",
"label.copy-to-clipboard": "复制", "label.copy-to-clipboard": "复制",
"label.current-password": "目前密码", "label.current-password": "目前密码",
"label.custom-range": "自定义时间段", "label.custom-range": "自定义时间段",
"label.dashboard": "仪表板", "label.dashboard": "仪表板",
"label.date-range": "多日", "label.date-range": "多日",
"label.default-date-range": "默认日期范围", "label.default-date-range": "默认日期范围",
"label.delete": "删除", "label.delete": "删除",
"label.delete-account": "删除账户", "label.delete-account": "删除账户",
"label.delete-website": "删除网站", "label.delete-website": "删除网站",
"label.dismiss": "Dismiss", "label.dismiss": "关闭",
"label.domain": "域名", "label.domain": "域名",
"label.edit": "编辑", "label.edit": "编辑",
"label.edit-account": "编辑账户", "label.edit-account": "编辑账户",
"label.edit-website": "编辑网站", "label.edit-website": "编辑网站",
"label.enable-share-url": "激活共享链接", "label.enable-share-url": "激活共享链接",
"label.invalid": "输入无效", "label.invalid": "输入无效",
"label.invalid-domain": "无效域名", "label.invalid-domain": "无效域名",
"label.last-days": "最近 {x} 天", "label.last-days": "最近 {x} 天",
"label.last-hours": "最近 {x} 小时", "label.last-hours": "最近 {x} 小时",
"label.logged-in-as": "登录名: {username}", "label.logged-in-as": "登录名: {username}",
"label.login": "登录", "label.login": "登录",
"label.logout": "退出", "label.logout": "退出",
"label.more": "更多", "label.more": "更多",
"label.name": "名字", "label.name": "名字",
"label.new-password": "新密码", "label.new-password": "新密码",
"label.password": "密码", "label.password": "密码",
"label.passwords-dont-match": "密码不一致", "label.passwords-dont-match": "密码不一致",
"label.profile": "个人资料", "label.profile": "个人资料",
"label.realtime": "Realtime", "label.realtime": "实时",
"label.realtime-logs": "Realtime logs", "label.realtime-logs": "实时日志",
"label.refresh": "刷新", "label.refresh": "刷新",
"label.required": "必填", "label.required": "必填",
"label.reset": "重置", "label.reset": "重置",
"label.save": "保存", "label.save": "保存",
"label.settings": "设置", "label.settings": "设置",
"label.share-url": "共享链接", "label.share-url": "共享链接",
"label.single-day": "单日", "label.single-day": "单日",
"label.this-month": "本月", "label.this-month": "本月",
"label.this-week": "本周", "label.this-week": "本周",
"label.this-year": "今年", "label.this-year": "今年",
"label.timezone": "时区", "label.timezone": "时区",
"label.today": "今天", "label.today": "今天",
"label.tracking-code": "跟踪代码", "label.tracking-code": "跟踪代码",
"label.unknown": "未知", "label.unknown": "未知",
"label.username": "用户名", "label.username": "用户名",
"label.view-details": "查看更多", "label.view-details": "查看更多",
"label.websites": "网站", "label.websites": "网站",
"message.active-users": "当前在线 {x} 人", "message.active-users": "当前在线 {x} 人",
"message.confirm-delete": "你确定要删除{target}吗?", "message.confirm-delete": "你确定要删除{target}吗?",
"message.copied": "复制成功!", "message.copied": "复制成功!",
"message.delete-warning": "所有相关数据将会被删除.", "message.delete-warning": "所有相关数据将会被删除.",
"message.failure": "出现错误.", "message.failure": "出现错误.",
"message.get-share-url": "获得共享链接", "message.get-share-url": "获得共享链接",
"message.get-tracking-code": "获得跟踪代码", "message.get-tracking-code": "获得跟踪代码",
"message.go-to-settings": "去设置", "message.go-to-settings": "去设置",
"message.incorrect-username-password": "用户名密码不正确.", "message.incorrect-username-password": "用户名密码不正确.",
"message.log.visitor": "Visitor from {country} using {browser} on {os} {device}", "message.log.visitor": "来自 {country} 的访客在搭载 {os} 的 {device} 上使用 {browser} 进行访问.",
"message.new-version-available": "A new version of umami {version} is available!", "message.new-version-available": "umami 有新版本 {version} 发布啦!",
"message.no-data-available": "无可用数据.", "message.no-data-available": "无可用数据.",
"message.no-websites-configured": "你还没有设置任何网站.", "message.no-websites-configured": "你还没有设置任何网站.",
"message.page-not-found": "网页未找到.", "message.page-not-found": "网页未找到.",
"message.powered-by": "运行 {name}", "message.powered-by": "运行 {name}",
"message.save-success": "成功保存.", "message.save-success": "成功保存.",
"message.share-url": "这是 {target} 的共享链接.", "message.share-url": "这是 {target} 的共享链接.",
"message.track-stats": "把以下代码放到你的网站的{head}部分来收集{target}的数据.", "message.track-stats": "把以下代码放到你的网站的{head}部分来收集{target}的数据.",
"message.type-delete": "在下面空格输入{delete}确认", "message.type-delete": "在下面空格输入{delete}确认",
"metrics.actions": "用户行为", "metrics.actions": "用户行为",
"metrics.average-visit-time": "平均访问时间", "metrics.average-visit-time": "平均访问时间",
"metrics.bounce-rate": "跳出率", "metrics.bounce-rate": "跳出率",
"metrics.browsers": "浏览器", "metrics.browsers": "浏览器",
"metrics.countries": "国家", "metrics.countries": "国家",
"metrics.device.desktop": "台式机", "metrics.device.desktop": "台式机",
"metrics.device.laptop": "笔记本", "metrics.device.laptop": "笔记本",
"metrics.device.mobile": "手机", "metrics.device.mobile": "手机",
"metrics.device.tablet": "平板", "metrics.device.tablet": "平板",
"metrics.devices": "设备", "metrics.devices": "设备",
"metrics.events": "行为类别", "metrics.events": "行为类别",
"metrics.filter.combined": "总和", "metrics.filter.combined": "总和",
"metrics.filter.domain-only": "只看域名", "metrics.filter.domain-only": "只看域名",
"metrics.filter.raw": "原始", "metrics.filter.raw": "原始",
"metrics.operating-systems": "操作系统", "metrics.operating-systems": "操作系统",
"metrics.page-views": "页面流量", "metrics.page-views": "页面流量",
"metrics.pages": "网页", "metrics.pages": "网页",
"metrics.referrers": "指入域名", "metrics.referrers": "指入域名",
"metrics.unique-visitors": "独立访客", "metrics.unique-visitors": "独立访客",
"metrics.views": "页面流量", "metrics.views": "页面流量",
"metrics.visitors": "独立访客" "metrics.visitors": "独立访客"
} }