feat: add Microsoft Clarity analytics provider
Add Microsoft Clarity as a fourth analytics provider option alongside Umami, Google Analytics, and Custom. Clarity provides free heatmaps, session recordings, and user analytics. - admin.types.ts: Add 'clarity' to AnalyticsProvider union type - api/admin/site/route.ts: Add 'clarity' to validation - admin/page.tsx: Add Clarity option to dropdown + Project ID input UI - layout.tsx: Inject Clarity tracking script with project ID
This commit is contained in:
+26
-2
@@ -408,7 +408,7 @@ interface SiteConfig {
|
||||
OIDCClientSecret?: string;
|
||||
OIDCButtonText?: string;
|
||||
AnalyticsEnabled?: boolean;
|
||||
AnalyticsProvider?: 'umami' | 'google' | 'custom';
|
||||
AnalyticsProvider?: 'umami' | 'google' | 'clarity' | 'custom';
|
||||
AnalyticsScriptUrl?: string;
|
||||
AnalyticsWebsiteId?: string;
|
||||
AnalyticsCustomScript?: string;
|
||||
@@ -11597,13 +11597,14 @@ const SiteConfigComponent = ({
|
||||
onChange={(e) =>
|
||||
setSiteSettings((prev) => ({
|
||||
...prev,
|
||||
AnalyticsProvider: e.target.value as 'umami' | 'google' | 'custom',
|
||||
AnalyticsProvider: e.target.value as 'umami' | 'google' | 'clarity' | 'custom',
|
||||
}))
|
||||
}
|
||||
className='mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 text-sm dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200'
|
||||
>
|
||||
<option value='umami'>Umami(开源,自托管)</option>
|
||||
<option value='google'>Google Analytics</option>
|
||||
<option value='clarity'>Microsoft Clarity(免费,热力图+会话回放)</option>
|
||||
<option value='custom'>自定义代码</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -11676,6 +11677,29 @@ const SiteConfigComponent = ({
|
||||
</div>
|
||||
)}
|
||||
|
||||
{siteSettings.AnalyticsProvider === 'clarity' && (
|
||||
<div>
|
||||
<label className='block text-sm font-medium text-gray-700 dark:text-gray-300'>
|
||||
Project ID
|
||||
</label>
|
||||
<input
|
||||
type='text'
|
||||
value={siteSettings.AnalyticsWebsiteId}
|
||||
onChange={(e) =>
|
||||
setSiteSettings((prev) => ({
|
||||
...prev,
|
||||
AnalyticsWebsiteId: e.target.value,
|
||||
}))
|
||||
}
|
||||
placeholder='e.g. abc1234567'
|
||||
className='mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 text-sm dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200'
|
||||
/>
|
||||
<p className='mt-1 text-xs text-gray-500 dark:text-gray-400'>
|
||||
Microsoft Clarity 的 Project ID,在 clarity.microsoft.com 项目设置中获取
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{siteSettings.AnalyticsProvider === 'custom' && (
|
||||
<div>
|
||||
<label className='block text-sm font-medium text-gray-700 dark:text-gray-300'>
|
||||
|
||||
Reference in New Issue
Block a user