first commit

calcom/packages/ui/components/apps/RecentAppsSlider.tsx

@@ -0,0 +1,28 @@
+import { useLocale } from "@calcom/lib/hooks/useLocale";
+import type { AppFrontendPayload as App } from "@calcom/types/App";
+
+import { AppCard } from "./AppCard";
+import { Slider } from "./Slider";
+
+export const RecentAppsSlider = <T extends App>({ items }: { items: T[] }) => {
+  const { t } = useLocale();
+
+  return (
+    <Slider<T>
+      title={t("recently_added")}
+      items={items.sort(
+        (a, b) => new Date(b?.createdAt || 0).valueOf() - new Date(a?.createdAt || 0).valueOf()
+      )}
+      itemKey={(app) => app.name}
+      options={{
+        perView: 3,
+        breakpoints: {
+          768 /* and below */: {
+            perView: 1,
+          },
+        },
+      }}
+      renderItem={(app) => <AppCard app={app} />}
+    />
+  );
+};