mirror of
https://github.com/dograh-hq/dograh.git
synced 2026-06-28 08:49:42 +02:00
fix: fix audio permission issue on safari (#26)
* fix: fix audio permission issue on safari * fix: fix service key creation in oss mode * fix: fix hydration error for usage page
This commit is contained in:
parent
a2d02d8326
commit
e9c0afd517
8 changed files with 90 additions and 71 deletions
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
import { Calendar, ChevronLeft, ChevronRight, Globe } from 'lucide-react';
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { useCallback, useEffect, useId, useState } from 'react';
|
||||
import TimezoneSelect, { type ITimezoneOption } from 'react-timezone-select';
|
||||
|
||||
import { getCurrentPeriodUsageApiV1OrganizationsUsageCurrentPeriodGet, getDailyUsageBreakdownApiV1OrganizationsUsageDailyBreakdownGet,getUsageHistoryApiV1OrganizationsUsageRunsGet } from '@/client/sdk.gen';
|
||||
|
|
@ -61,18 +61,11 @@ export default function UsagePage() {
|
|||
// Media preview dialog
|
||||
const mediaPreview = MediaPreviewDialog({ accessToken });
|
||||
|
||||
// Timezone state - wait for userConfig to load before setting default
|
||||
// Timezone state - initialize with empty string to avoid hydration mismatch
|
||||
const localTimezone = getLocalTimezone();
|
||||
const [selectedTimezone, setSelectedTimezone] = useState<ITimezoneOption | string>(() => {
|
||||
// Only use local timezone if we know for sure there's no saved timezone
|
||||
// (i.e., userConfig has loaded and has no timezone)
|
||||
if (!userConfigLoading && !userConfig?.timezone) {
|
||||
return localTimezone;
|
||||
}
|
||||
// Otherwise return the saved timezone or empty string while loading
|
||||
return userConfig?.timezone || '';
|
||||
});
|
||||
const [selectedTimezone, setSelectedTimezone] = useState<ITimezoneOption | string>('');
|
||||
const [savingTimezone, setSavingTimezone] = useState(false);
|
||||
const timezoneSelectId = useId(); // Stable ID for react-select to prevent hydration mismatch
|
||||
|
||||
// Fetch current usage
|
||||
const fetchCurrentUsage = useCallback(async () => {
|
||||
|
|
@ -328,6 +321,7 @@ export default function UsagePage() {
|
|||
<Globe className="h-4 w-4 text-gray-500" />
|
||||
<div className="w-[300px]">
|
||||
<TimezoneSelect
|
||||
instanceId={timezoneSelectId}
|
||||
value={selectedTimezone}
|
||||
onChange={handleTimezoneChange}
|
||||
isDisabled={savingTimezone || userConfigLoading}
|
||||
|
|
@ -408,14 +402,6 @@ export default function UsagePage() {
|
|||
Total Duration: <span className="font-medium text-gray-900">{formatDuration(currentUsage.total_duration_seconds)}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{!currentUsage.quota_enabled && (
|
||||
<div className="bg-yellow-50 border border-yellow-200 rounded-md p-3">
|
||||
<p className="text-sm text-yellow-800">
|
||||
Quota enforcement is not enabled for your organization.
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<p className="text-gray-500">Unable to load usage data</p>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue