npm - @alepha/ui - Versions diffs - 0.16.0 → 0.16.2 - Mend

@alepha/ui 0.16.0 → 0.16.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (152) hide show

package/dist/admin/{AdminNotifications-Ds5Un0NJ.js.map → AdminNotifications-LwR6RKrx.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AdminNotifications-~~Ds5Un0NJ~~.js","names":[],"sources":["../../src/admin/components/notifications/AdminNotifications.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge, Tooltip } from \"@mantine/core\";\nimport {\n IconAlertCircle,\n IconCheck,\n IconClock,\n IconMail,\n IconMessage,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport type {\n AdminNotificationController,\n NotificationEntity,\n} from \"alepha/api/notifications\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\n\nconst AdminNotifications = () => {\n const client = useClient<AdminNotificationController>();\n const { l } = useI18n();\n\n const filters = t.object({\n type: t.optional(\n t.enum([\"email\", \"sms\"], {\n title: \"Type\",\n }),\n ),\n status: t.optional(\n t.enum([\"pending\", \"sent\", \"failed\"], {\n title: \"Status\",\n }),\n ),\n template: t.optional(\n t.string({\n title: \"Template\",\n }),\n ),\n contact: t.optional(\n t.string({\n title: \"Contact\",\n }),\n ),\n });\n\n const getStatus = (item: NotificationEntity) => {\n if (item.error) return \"failed\";\n if (item.sentAt) return \"sent\";\n return \"pending\";\n };\n\n const getStatusBadge = (item: NotificationEntity) => {\n const status = getStatus(item);\n switch (status) {\n case \"sent\":\n return (\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"green\"\n leftSection={<IconCheck size={12} />}\n >\n Sent\n </Badge>\n );\n case \"failed\":\n return (\n <Tooltip label={item.error?.message} multiline maw={300}>\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"red\"\n leftSection={<IconAlertCircle size={12} />}\n >\n Failed\n </Badge>\n </Tooltip>\n );\n default:\n return (\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"yellow\"\n leftSection={<IconClock size={12} />}\n >\n Pending\n </Badge>\n );\n }\n };\n\n return (\n <Flex flex={1} direction=\"column\">\n <DataTable<NotificationEntity, typeof filters>\n submitOnInit\n defaultSize={10}\n typeFormProps={{\n skipSubmitButton: true,\n columns: 4,\n }}\n tableProps={{\n horizontalSpacing: \"xs\",\n verticalSpacing: \"xs\",\n }}\n onFilterChange={(_key, _value, form) => {\n return form.submit();\n }}\n filters={filters}\n tableTrProps={(item) => {\n const status = getStatus(item);\n if (status === \"failed\") {\n return {\n bg: \"var(--mantine-color-red-light)\",\n };\n }\n return {};\n }}\n items={async (filters) => {\n const response = await client.findNotifications({\n query: filters,\n });\n\n return response as Page<NotificationEntity>;\n }}\n columns={{\n type: {\n label: \"Type\",\n fit: true,\n value: (item) => (\n <Badge\n size=\"sm\"\n variant=\"outline\"\n leftSection={\n item.type === \"email\" ? (\n <IconMail size={12} />\n ) : (\n <IconMessage size={12} />\n )\n }\n >\n {item.type.toUpperCase()}\n </Badge>\n ),\n },\n template: {\n label: \"Template\",\n value: (item) => (\n <Text size=\"sm\" fw={500}>\n {item.template}\n </Text>\n ),\n },\n contact: {\n label: \"Contact\",\n value: (item) => (\n <Text size=\"sm\" ff=\"monospace\">\n {item.contact}\n </Text>\n ),\n },\n category: {\n label: \"Category\",\n fit: true,\n value: (item) =>\n item.category ? (\n <Badge size=\"xs\" variant=\"light\">\n {item.category}\n </Badge>\n ) : (\n <Text size=\"xs\" c=\"dimmed\">\n -\n </Text>\n ),\n },\n status: {\n label: \"Status\",\n fit: true,\n value: (item) => getStatusBadge(item),\n },\n sentAt: {\n label: \"Sent\",\n fit: true,\n value: (item) => (\n <Text size=\"xs\" c=\"dimmed\">\n {item.sentAt ? l(item.sentAt, { date: \"fromNow\" }) : \"-\"}\n </Text>\n ),\n },\n createdAt: {\n label: \"Created\",\n fit: true,\n value: (item) => (\n <Text size=\"xs\" c=\"dimmed\">\n {l(item.createdAt, { date: \"fromNow\" })}\n </Text>\n ),\n },\n }}\n />\n </Flex>\n );\n};\n\nexport default AdminNotifications;\n"],"mappings":"~~;;;;;;;;;~~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~~;;AAIX,iCAAe~~"}
1	+ {"version":3,"file":"AdminNotifications-LwR6RKrx.js","names":[],"sources":["../../src/admin/components/notifications/AdminNotifications.tsx"],"sourcesContent":["import { DataTable, Flex, Text } from \"@alepha/ui\";\nimport { Badge, Tooltip } from \"@mantine/core\";\nimport {\n IconAlertCircle,\n IconCheck,\n IconClock,\n IconMail,\n IconMessage,\n} from \"@tabler/icons-react\";\nimport { type Page, t } from \"alepha\";\nimport type {\n AdminNotificationController,\n NotificationEntity,\n} from \"alepha/api/notifications\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\n\nconst AdminNotifications = () => {\n const client = useClient<AdminNotificationController>();\n const { l } = useI18n();\n\n const filters = t.object({\n type: t.optional(\n t.enum([\"email\", \"sms\"], {\n title: \"Type\",\n }),\n ),\n status: t.optional(\n t.enum([\"pending\", \"sent\", \"failed\"], {\n title: \"Status\",\n }),\n ),\n template: t.optional(\n t.string({\n title: \"Template\",\n }),\n ),\n contact: t.optional(\n t.string({\n title: \"Contact\",\n }),\n ),\n });\n\n const getStatus = (item: NotificationEntity) => {\n if (item.error) return \"failed\";\n if (item.sentAt) return \"sent\";\n return \"pending\";\n };\n\n const getStatusBadge = (item: NotificationEntity) => {\n const status = getStatus(item);\n switch (status) {\n case \"sent\":\n return (\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"green\"\n leftSection={<IconCheck size={12} />}\n >\n Sent\n </Badge>\n );\n case \"failed\":\n return (\n <Tooltip label={item.error?.message} multiline maw={300}>\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"red\"\n leftSection={<IconAlertCircle size={12} />}\n >\n Failed\n </Badge>\n </Tooltip>\n );\n default:\n return (\n <Badge\n size=\"sm\"\n variant=\"light\"\n color=\"yellow\"\n leftSection={<IconClock size={12} />}\n >\n Pending\n </Badge>\n );\n }\n };\n\n return (\n <Flex flex={1} direction=\"column\">\n <DataTable<NotificationEntity, typeof filters>\n submitOnInit\n defaultSize={10}\n typeFormProps={{\n skipSubmitButton: true,\n columns: 4,\n }}\n tableProps={{\n horizontalSpacing: \"xs\",\n verticalSpacing: \"xs\",\n }}\n onFilterChange={(_key, _value, form) => {\n return form.submit();\n }}\n filters={filters}\n tableTrProps={(item) => {\n const status = getStatus(item);\n if (status === \"failed\") {\n return {\n bg: \"var(--mantine-color-red-light)\",\n };\n }\n return {};\n }}\n items={async (filters) => {\n const response = await client.findNotifications({\n query: filters,\n });\n\n return response as Page<NotificationEntity>;\n }}\n columns={{\n type: {\n label: \"Type\",\n fit: true,\n value: (item) => (\n <Badge\n size=\"sm\"\n variant=\"outline\"\n leftSection={\n item.type === \"email\" ? (\n <IconMail size={12} />\n ) : (\n <IconMessage size={12} />\n )\n }\n >\n {item.type.toUpperCase()}\n </Badge>\n ),\n },\n template: {\n label: \"Template\",\n value: (item) => (\n <Text size=\"sm\" fw={500}>\n {item.template}\n </Text>\n ),\n },\n contact: {\n label: \"Contact\",\n value: (item) => (\n <Text size=\"sm\" ff=\"monospace\">\n {item.contact}\n </Text>\n ),\n },\n category: {\n label: \"Category\",\n fit: true,\n value: (item) =>\n item.category ? (\n <Badge size=\"xs\" variant=\"light\">\n {item.category}\n </Badge>\n ) : (\n <Text size=\"xs\" c=\"dimmed\">\n -\n </Text>\n ),\n },\n status: {\n label: \"Status\",\n fit: true,\n value: (item) => getStatusBadge(item),\n },\n sentAt: {\n label: \"Sent\",\n fit: true,\n value: (item) => (\n <Text size=\"xs\" c=\"dimmed\">\n {item.sentAt ? l(item.sentAt, { date: \"fromNow\" }) : \"-\"}\n </Text>\n ),\n },\n createdAt: {\n label: \"Created\",\n fit: true,\n value: (item) => (\n <Text size=\"xs\" c=\"dimmed\">\n {l(item.createdAt, { date: \"fromNow\" })}\n </Text>\n ),\n },\n }}\n />\n </Flex>\n );\n};\n\nexport default AdminNotifications;\n"],"mappings":"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"}