{"ast":null,"code":"var _jsxFileName = \"/home/gnx/Desktop/gnx-mail/frontend/src/pages/Dashboard.js\",\n _s = $RefreshSig$();\nimport React from 'react';\nimport { useQuery } from 'react-query';\nimport { Mail, Inbox, Send, Star, Archive, Trash2, Plus, TrendingUp, Users, Clock } from 'lucide-react';\nimport { api, endpoints } from '../services/api';\nimport LoadingSpinner from '../components/LoadingSpinner';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst Dashboard = () => {\n _s();\n const {\n data: emailStats,\n isLoading: emailStatsLoading\n } = useQuery('emailStats', () => api.get(endpoints.emailStats).then(res => res.data));\n const {\n data: contactStats,\n isLoading: contactStatsLoading\n } = useQuery('contactStats', () => api.get(endpoints.contactStats).then(res => res.data));\n const {\n data: recentEmails,\n isLoading: recentEmailsLoading\n } = useQuery('recentEmails', () => api.get(`${endpoints.emails}?limit=5`).then(res => res.data.results));\n const stats = [{\n name: 'Total Emails',\n value: (emailStats === null || emailStats === void 0 ? void 0 : emailStats.total_emails) || 0,\n icon: Mail,\n color: 'bg-blue-500',\n change: '+12%',\n changeType: 'positive'\n }, {\n name: 'Unread Emails',\n value: (emailStats === null || emailStats === void 0 ? void 0 : emailStats.unread_emails) || 0,\n icon: Inbox,\n color: 'bg-red-500',\n change: '+3',\n changeType: 'negative'\n }, {\n name: 'Sent Emails',\n value: (emailStats === null || emailStats === void 0 ? void 0 : emailStats.sent_emails) || 0,\n icon: Send,\n color: 'bg-green-500',\n change: '+8%',\n changeType: 'positive'\n }, {\n name: 'Contacts',\n value: (contactStats === null || contactStats === void 0 ? void 0 : contactStats.total_contacts) || 0,\n icon: Users,\n color: 'bg-purple-500',\n change: '+2',\n changeType: 'positive'\n }];\n const quickActions = [{\n name: 'Compose Email',\n description: 'Write a new email',\n icon: Plus,\n href: '/compose',\n color: 'bg-primary-600 hover:bg-primary-700'\n }, {\n name: 'View Inbox',\n description: 'Check your messages',\n icon: Inbox,\n href: '/inbox',\n color: 'bg-blue-600 hover:bg-blue-700'\n }, {\n name: 'Manage Contacts',\n description: 'Organize your contacts',\n icon: Users,\n href: '/contacts',\n color: 'bg-green-600 hover:bg-green-700'\n }, {\n name: 'Settings',\n description: 'Configure your account',\n icon: Star,\n href: '/settings',\n color: 'bg-purple-600 hover:bg-purple-700'\n }];\n if (emailStatsLoading || contactStatsLoading) {\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-center justify-center h-64\",\n children: /*#__PURE__*/_jsxDEV(LoadingSpinner, {\n size: \"lg\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 103,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 102,\n columnNumber: 7\n }, this);\n }\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-6\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"md:flex md:items-center md:justify-between\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-1 min-w-0\",\n children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"text-2xl font-bold leading-7 text-gray-900 sm:text-3xl sm:truncate\",\n children: \"Dashboard\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 113,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"mt-1 text-sm text-gray-500\",\n children: \"Welcome back! Here's what's happening with your email.\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 116,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 112,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 111,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-4\",\n children: stats.map(stat => {\n const Icon = stat.icon;\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-body\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-center\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-shrink-0\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: `p-3 rounded-md ${stat.color}`,\n children: /*#__PURE__*/_jsxDEV(Icon, {\n className: \"h-6 w-6 text-white\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 132,\n columnNumber: 23\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 131,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 130,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"ml-5 w-0 flex-1\",\n children: /*#__PURE__*/_jsxDEV(\"dl\", {\n children: [/*#__PURE__*/_jsxDEV(\"dt\", {\n className: \"text-sm font-medium text-gray-500 truncate\",\n children: stat.name\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 137,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"dd\", {\n className: \"flex items-baseline\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-2xl font-semibold text-gray-900\",\n children: stat.value\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 141,\n columnNumber: 25\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: `ml-2 flex items-baseline text-sm font-semibold ${stat.changeType === 'positive' ? 'text-green-600' : 'text-red-600'}`,\n children: [/*#__PURE__*/_jsxDEV(TrendingUp, {\n className: \"self-center flex-shrink-0 h-4 w-4\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 147,\n columnNumber: 27\n }, this), /*#__PURE__*/_jsxDEV(\"span\", {\n className: \"sr-only\",\n children: [stat.changeType === 'positive' ? 'Increased' : 'Decreased', \" by\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 148,\n columnNumber: 27\n }, this), stat.change]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 144,\n columnNumber: 25\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 140,\n columnNumber: 23\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 136,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 135,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 129,\n columnNumber: 17\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 128,\n columnNumber: 15\n }, this)\n }, stat.name, false, {\n fileName: _jsxFileName,\n lineNumber: 127,\n columnNumber: 13\n }, this);\n })\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 123,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"grid grid-cols-1 gap-6 lg:grid-cols-2\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-header\",\n children: /*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"text-lg font-medium text-gray-900\",\n children: \"Quick Actions\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 167,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 166,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-body\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"grid grid-cols-1 gap-4 sm:grid-cols-2\",\n children: quickActions.map(action => {\n const Icon = action.icon;\n return /*#__PURE__*/_jsxDEV(\"a\", {\n href: action.href,\n className: `relative rounded-lg border border-gray-300 bg-white px-6 py-5 shadow-sm flex items-center space-x-3 hover:shadow-md transition-shadow duration-200 ${action.color}`,\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-shrink-0\",\n children: /*#__PURE__*/_jsxDEV(Icon, {\n className: \"h-6 w-6 text-white\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 180,\n columnNumber: 23\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 179,\n columnNumber: 21\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-1 min-w-0\",\n children: [/*#__PURE__*/_jsxDEV(\"span\", {\n className: \"absolute inset-0\",\n \"aria-hidden\": \"true\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 183,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm font-medium text-white\",\n children: action.name\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 184,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm text-white opacity-90\",\n children: action.description\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 185,\n columnNumber: 23\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 21\n }, this)]\n }, action.name, true, {\n fileName: _jsxFileName,\n lineNumber: 174,\n columnNumber: 19\n }, this);\n })\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 170,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 169,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 165,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-header\",\n children: /*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"text-lg font-medium text-gray-900\",\n children: \"Recent Emails\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 197,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-body\",\n children: recentEmailsLoading ? /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-center justify-center h-32\",\n children: /*#__PURE__*/_jsxDEV(LoadingSpinner, {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 202,\n columnNumber: 17\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 201,\n columnNumber: 15\n }, this) : recentEmails && recentEmails.length > 0 ? /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-4\",\n children: recentEmails.map(email => /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-start space-x-3\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-shrink-0\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"h-8 w-8 rounded-full bg-gray-300 flex items-center justify-center\",\n children: /*#__PURE__*/_jsxDEV(\"span\", {\n className: \"text-sm font-medium text-gray-700\",\n children: email.from_email.charAt(0).toUpperCase()\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 210,\n columnNumber: 25\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 209,\n columnNumber: 23\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 208,\n columnNumber: 21\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-1 min-w-0\",\n children: [/*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm font-medium text-gray-900 truncate\",\n children: email.from_email\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 216,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm text-gray-500 truncate\",\n children: email.subject\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 219,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-center mt-1 text-xs text-gray-400\",\n children: [/*#__PURE__*/_jsxDEV(Clock, {\n className: \"h-3 w-3 mr-1\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 223,\n columnNumber: 25\n }, this), new Date(email.created_at).toLocaleDateString()]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 222,\n columnNumber: 23\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 215,\n columnNumber: 21\n }, this), !email.is_read && /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex-shrink-0\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"h-2 w-2 rounded-full bg-blue-500\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 229,\n columnNumber: 25\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 228,\n columnNumber: 23\n }, this)]\n }, email.id, true, {\n fileName: _jsxFileName,\n lineNumber: 207,\n columnNumber: 19\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 205,\n columnNumber: 15\n }, this) : /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-center py-6\",\n children: [/*#__PURE__*/_jsxDEV(Mail, {\n className: \"mx-auto h-12 w-12 text-gray-400\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 237,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"mt-2 text-sm font-medium text-gray-900\",\n children: \"No emails\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 238,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"mt-1 text-sm text-gray-500\",\n children: \"You don't have any emails yet.\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 239,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 236,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 199,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 195,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 163,\n columnNumber: 7\n }, this), (emailStats === null || emailStats === void 0 ? void 0 : emailStats.folder_stats) && emailStats.folder_stats.length > 0 && /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-header\",\n children: /*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"text-lg font-medium text-gray-900\",\n children: \"Folder Statistics\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 252,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 251,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"card-body\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\",\n children: emailStats.folder_stats.map(folder => /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex items-center justify-between p-4 bg-gray-50 rounded-lg\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n children: [/*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm font-medium text-gray-900\",\n children: folder.name\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 259,\n columnNumber: 21\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-sm text-gray-500\",\n children: [folder.unread_count, \" unread of \", folder.email_count, \" total\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 260,\n columnNumber: 21\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 258,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-right\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-lg font-semibold text-gray-900\",\n children: folder.email_count\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 265,\n columnNumber: 21\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-sm text-gray-500\",\n children: \"emails\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 268,\n columnNumber: 21\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 264,\n columnNumber: 19\n }, this)]\n }, folder.name, true, {\n fileName: _jsxFileName,\n lineNumber: 257,\n columnNumber: 17\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 255,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 254,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 250,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 109,\n columnNumber: 5\n }, this);\n};\n_s(Dashboard, \"pCjC1cA6DtPJ14HqM7L0vpUR9bo=\", false, function () {\n return [useQuery, useQuery, useQuery];\n});\n_c = Dashboard;\nexport default Dashboard;\nvar _c;\n$RefreshReg$(_c, \"Dashboard\");","map":{"version":3,"names":["React","useQuery","Mail","Inbox","Send","Star","Archive","Trash2","Plus","TrendingUp","Users","Clock","api","endpoints","LoadingSpinner","jsxDEV","_jsxDEV","Dashboard","_s","data","emailStats","isLoading","emailStatsLoading","get","then","res","contactStats","contactStatsLoading","recentEmails","recentEmailsLoading","emails","results","stats","name","value","total_emails","icon","color","change","changeType","unread_emails","sent_emails","total_contacts","quickActions","description","href","className","children","size","fileName","_jsxFileName","lineNumber","columnNumber","map","stat","Icon","action","length","email","from_email","charAt","toUpperCase","subject","Date","created_at","toLocaleDateString","is_read","id","folder_stats","folder","unread_count","email_count","_c","$RefreshReg$"],"sources":["/home/gnx/Desktop/gnx-mail/frontend/src/pages/Dashboard.js"],"sourcesContent":["import React from 'react';\nimport { useQuery } from 'react-query';\nimport { \n Mail, \n Inbox, \n Send, \n Star, \n Archive, \n Trash2, \n Plus,\n TrendingUp,\n Users,\n Clock\n} from 'lucide-react';\nimport { api, endpoints } from '../services/api';\nimport LoadingSpinner from '../components/LoadingSpinner';\n\nconst Dashboard = () => {\n const { data: emailStats, isLoading: emailStatsLoading } = useQuery(\n 'emailStats',\n () => api.get(endpoints.emailStats).then(res => res.data)\n );\n\n const { data: contactStats, isLoading: contactStatsLoading } = useQuery(\n 'contactStats',\n () => api.get(endpoints.contactStats).then(res => res.data)\n );\n\n const { data: recentEmails, isLoading: recentEmailsLoading } = useQuery(\n 'recentEmails',\n () => api.get(`${endpoints.emails}?limit=5`).then(res => res.data.results)\n );\n\n const stats = [\n {\n name: 'Total Emails',\n value: emailStats?.total_emails || 0,\n icon: Mail,\n color: 'bg-blue-500',\n change: '+12%',\n changeType: 'positive',\n },\n {\n name: 'Unread Emails',\n value: emailStats?.unread_emails || 0,\n icon: Inbox,\n color: 'bg-red-500',\n change: '+3',\n changeType: 'negative',\n },\n {\n name: 'Sent Emails',\n value: emailStats?.sent_emails || 0,\n icon: Send,\n color: 'bg-green-500',\n change: '+8%',\n changeType: 'positive',\n },\n {\n name: 'Contacts',\n value: contactStats?.total_contacts || 0,\n icon: Users,\n color: 'bg-purple-500',\n change: '+2',\n changeType: 'positive',\n },\n ];\n\n const quickActions = [\n {\n name: 'Compose Email',\n description: 'Write a new email',\n icon: Plus,\n href: '/compose',\n color: 'bg-primary-600 hover:bg-primary-700',\n },\n {\n name: 'View Inbox',\n description: 'Check your messages',\n icon: Inbox,\n href: '/inbox',\n color: 'bg-blue-600 hover:bg-blue-700',\n },\n {\n name: 'Manage Contacts',\n description: 'Organize your contacts',\n icon: Users,\n href: '/contacts',\n color: 'bg-green-600 hover:bg-green-700',\n },\n {\n name: 'Settings',\n description: 'Configure your account',\n icon: Star,\n href: '/settings',\n color: 'bg-purple-600 hover:bg-purple-700',\n },\n ];\n\n if (emailStatsLoading || contactStatsLoading) {\n return (\n
\n Welcome back! Here's what's happening with your email.\n
\n{action.name}
\n{action.description}
\n\n {email.from_email}\n
\n\n {email.subject}\n
\n\n You don't have any emails yet.\n
\n{folder.name}
\n\n {folder.unread_count} unread of {folder.email_count} total\n
\n