30b72b687e
* init page * init insights frontend * nit * nit * nit * merge * fixed icons * i18n, needs features * Init insights trpc * Using trpc on client * Added events timeline * Seed analytics script * connect ui with trpc * Added and fixed event time lines * WIP popular days and avg time duration event type * added new metric graphs * improved upgrade tip * always show upgrade screen * upgrade tremor.so and select inputs for page * Remove log * Move everything to components and add context * Fix select types using calcom ui one * Adding translations * Add missing translations * Add more translations * min fix * Fixes for date select * Prefer early return and mobile design fixes * Fix style for mobile * Fix data with userId filter from popular events * add user id to average time duration * fix types for select-react * Removed submodules * Delete website * Update yarn.lock * Code organization and type fixes * trpc fixes * Builds are now passing * Relocates server code * Add url state in insights * Update FiltersProvider.tsx * Cleanup * Update embed-iframe.ts * Update FilterType.tsx * Update seed-app-store.config.json * Update index.tsx * Renamed seeder * Update FiltersProvider.tsx * Fix for query params * no wrap on lg screen * Fix shadow borders from tremor components, fix title font * Add ring-gray to match filters * add cursor pointer * copy improvements * blue to black * fixed date select focus * text right for table * Adds missing translation strings * Fix url state for filter type * more layout improvements * more padding improvements * more UI fixes (padding, sizes) requested by ciaran * Apply suggestions from code review * WIP user without team metrics * yarn * Adds loading state for graphs and tables * fix average render when no data * Multiple fixes in insights * Fix most and least booked members querys * More fix for clear filters --------- Co-authored-by: Peer Richelsen <peer@cal.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: zomars <zomars@me.com>
27 lines
900 B
TypeScript
27 lines
900 B
TypeScript
import { classNames } from "@calcom/lib";
|
|
import { SkeletonText } from "@calcom/ui";
|
|
|
|
import { CardInsights } from "./Card";
|
|
|
|
export const LoadingInsight = () => {
|
|
return (
|
|
<CardInsights>
|
|
<SkeletonText className="w-32" />
|
|
<div className="m-auto flex h-80 flex-col items-center justify-center">
|
|
<svg
|
|
className={classNames("mx-4 h-8 w-8 animate-spin", "text-black dark:text-white")}
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24">
|
|
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
|
|
<path
|
|
className="opacity-75"
|
|
fill="currentColor"
|
|
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</CardInsights>
|
|
);
|
|
};
|