Skip to main content
New version 2.0.0-beta.7 is out! 🎉 Now supporting collection groups!
FireCMS
Product
Features
Advanced content editing
The most powerful backend
Enterprise
ChatGPT
Docs
2.0.0-beta
1.0.0
2.0.0-beta
</div><div class="toggle_vylO colorModeToggle_DEke"><button class="clean-btn toggleButton_gllP toggleButtonDisabled_aARS" type="button" disabled="" title="Switch between dark and light mode (currently light mode)" aria-label="Switch between dark and light mode (currently light mode)" aria-live="polite"><svg viewBox="0 0 24 24" width="24" height="24" class="lightToggleIcon_pyhR"><path fill="currentColor" d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"></path></svg><svg viewBox="0 0 24 24" width="24" height="24" class="darkToggleIcon_wfgR"><path fill="currentColor" d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"></path></svg></button></div><div class="searchBox_ZlJk"></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div id="docusaurus_skipToContent_fallback" class="main-wrapper mainWrapper_z2l0 docsWrapper_BCFX"><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_sjWU" type="button"></button><div class="docPage__5DB"><aside class="theme-doc-sidebar-container docSidebarContainer_b6E3"><div class="sidebarViewport_Xe31"><div class="sidebar_njMd"><nav aria-label="Docs sidebar" class="menu thin-scrollbar menu_SIkG menuWithAnnouncementBar_GW3s"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/">Introduction</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/quickstart">Quickstart</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/openai">✨ ChatGPT plugin</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/new_in_v2">New and updated features in version 2.0</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="true" href="/docs/collections/">Collections</a></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/">Collections</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/callbacks">Entity callbacks</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/permissions">Permissions</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/exporting_data">Exporting data</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/text_search">Text search</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/dynamic_collections">Dynamic collections</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/custom_entity_views">Custom entity views</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/collections/collection_groups">Collections Groups</a></li></ul></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="true" href="/docs/properties/properties_intro">Properties</a></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/properties/properties_intro">Properties</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-2 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" tabindex="0" href="/docs/properties/fields/text_fields">Fields</a></div></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-2 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" tabindex="0" href="/docs/properties/config/properties_common">Config</a></div></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/properties/conditional_fields">Conditional fields</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/properties/custom_fields">Custom fields</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/properties/custom_previews">Custom previews</a></li></ul></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/navigation/app_config">App Config</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/navigation/custom_top_level_views">Custom top level views</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/firebase_setup">Firebase setup</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/deployment">Deployment</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" href="/docs/hooks/use_auth_controller">Provided hooks</a></div></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret menu__link--active" aria-expanded="true" href="/docs/recipes/building_a_blog">Recipes</a></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/recipes/building_a_blog">Building a blog</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/recipes/copy_entity">Copying from another collection</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link menu__link--active" aria-current="page" tabindex="0" href="/docs/recipes/custom_datasource">Custom data source</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/recipes/documents_as_subcollections">Dynamic root collections</a></li></ul></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/nextjs">Using with Next.js</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/custom_cms_app">Custom CMSApp</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/migrating_from_v1">Migrating from version 1.0 to 2.0</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/changelog">Changelog</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" href="/docs/api/">API reference</a></div></li></ul></nav></div></div></aside><main class="docMainContainer_gTbr"><div class="container padding-top--md padding-bottom--lg"><div class="row"><div class="col docItemCol_VOVn"><div class="docItemContainer_Djhp"><article><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Z_bl" aria-label="Breadcrumbs"><ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList"><li class="breadcrumbs__item"><a aria-label="Home page" class="breadcrumbs__link" href="/"><svg viewBox="0 0 24 24" class="breadcrumbHomeIcon_YNFT"><path d="M10 19v-5h4v5c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-7h1.7c.46 0 .68-.57.33-.87L12.67 3.6c-.38-.34-.96-.34-1.34 0l-8.36 7.53c-.34.3-.13.87.33.87H5v7c0 .55.45 1 1 1h3c.55 0 1-.45 1-1z" fill="currentColor"></path></svg></a></li><li class="breadcrumbs__item"><span class="breadcrumbs__link">Recipes</span><meta itemprop="position" content="1"></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active"><span class="breadcrumbs__link" itemprop="name">Custom data source</span><meta itemprop="position" content="2"></li></ul></nav><span class="theme-doc-version-badge badge badge--secondary">Version: 2.0.0-beta</span><div class="tocCollapsible_ETCw theme-doc-toc-mobile tocMobile_ITEo"><button type="button" class="clean-btn tocCollapsibleButton_TO0P">On this page</button></div><div class="theme-doc-markdown markdown"><header><h1>Use a custom data source</h1></header><p>FireCMS is based on the idea of <strong>declarative</strong> data sources. This means that you can define your collections and entities in a declarative way, and FireCMS will take care of the rest. We provide a default datasource that works with Firestore, but you can also use your own data sources.</p><h2 class="anchor anchorWithStickyNavbar_LWe7" id="custom-data-sources">Custom data sources<a href="#custom-data-sources" class="hash-link" aria-label="Direct link to Custom data sources" title="Direct link to Custom data sources">​</a></h2><p>FireCMS allows you to use your own data sources. This is useful if you want to use FireCMS with a different database, or if you want to use a different Firestore instance.</p><p>Data sources are implemented as objects that implement the <a href="/docs/recipes/api/interfaces/DataSource"><code>DataSource</code></a> interface.</p><p>Since FireCMS is a CMS based on React, you can use the hooks provided by FireCMS to develop your own data sources.</p><p>The default datasource is implemented in the <a href="/docs/recipes/api/functions/useFirestoreDataSource"><code>useFirestoreDataSource</code></a> hook. You can call this hook from your own data source to get the default implementation and extend it. When defining your own data source, you need to implement all the methods defined in the <a href="/docs/recipes/api/interfaces/DataSource"><code>DataSource</code></a> interface.</p><h2 class="anchor anchorWithStickyNavbar_LWe7" id="example-custom-datasource">Example custom datasource<a href="#example-custom-datasource" class="hash-link" aria-label="Direct link to Example custom datasource" title="Direct link to Example custom datasource">​</a></h2><p>Let's define a custom data source that will allow us to override the default implementation when fetching and saving data for a specific path only:</p><div class="language-tsx codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#9CDCFE;--prism-background-color:#1E1E1E"><div class="codeBlockContent_biex"><pre tabindex="0" class="prism-code language-tsx codeBlock_bY9V thin-scrollbar"><code class="codeBlockLines_e6Vv"><span class="token-line" style="color:#9CDCFE"><span class="token keyword" style="color:rgb(86, 156, 214)">import</span><span class="token plain"> </span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">CMSType</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">DataSource</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">DeleteEntityProps</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">Entity</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">EntityCollection</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">FetchCollectionProps</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">FetchEntityProps</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">ResolvedProperty</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> </span><span class="token imports maybe-class-name">SaveEntityProps</span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token imports"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"> useFirestoreDataSource</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token imports"></span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">from</span><span class="token plain"> </span><span class="token string" style="color:rgb(206, 145, 120)">"firecms"</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"></span><span class="token keyword" style="color:rgb(86, 156, 214)">import</span><span class="token plain"> </span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token imports"> </span><span class="token imports maybe-class-name">FirebaseApp</span><span class="token imports"> </span><span class="token imports punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">from</span><span class="token plain"> </span><span class="token string" style="color:rgb(206, 145, 120)">"firebase/app"</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"></span><span class="token keyword" style="color:rgb(86, 156, 214)">type</span><span class="token plain"> </span><span class="token class-name" style="color:rgb(78, 201, 176)">CustomDataSourceProps</span><span class="token plain"> </span><span class="token operator" style="color:rgb(212, 212, 212)">=</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"> firebaseApp</span><span class="token operator" style="color:rgb(212, 212, 212)">?</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">FirebaseApp</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"></span><span class="token comment" style="color:rgb(106, 153, 85)">/**</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token comment" style="color:rgb(106, 153, 85)"> * This is an example of a custom data source.</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token comment" style="color:rgb(106, 153, 85)"> * It is a React Hook that returns a {@link DataSource} object.</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token comment" style="color:rgb(106, 153, 85)"> * @param firebaseApp</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token comment" style="color:rgb(106, 153, 85)"> */</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"></span><span class="token keyword" style="color:rgb(86, 156, 214)">export</span><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">function</span><span class="token plain"> </span><span class="token function" style="color:rgb(220, 220, 170)">useCustomDatasource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"> firebaseApp </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">CustomDataSourceProps</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">DataSource</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">const</span><span class="token plain"> firestoreDataSource </span><span class="token operator" style="color:rgb(212, 212, 212)">=</span><span class="token plain"> </span><span class="token function" style="color:rgb(220, 220, 170)">useFirestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> firebaseApp</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token generic-function function" style="color:rgb(220, 220, 170)">fetchCollection</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)"><</span><span class="token generic-function generic class-name constant" style="color:rgb(100, 102, 149)">M</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name keyword" style="color:rgb(86, 156, 214)">extends</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">[</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)">Key</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name builtin" style="color:rgb(86, 156, 214)">string</span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">]</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> CMSType</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">FetchCollectionProps</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token maybe-class-name">Entity</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">[</span><span class="token punctuation" style="color:rgb(212, 212, 212)">]</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">if</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token property-access">path</span><span class="token plain"> </span><span class="token operator" style="color:rgb(212, 212, 212)">===</span><span class="token plain"> </span><span class="token string" style="color:rgb(206, 145, 120)">"your_path_custom"</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token comment" style="color:rgb(106, 153, 85)">// make your custom http call and return your Entities</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">fetchCollection</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token generic-function function" style="color:rgb(220, 220, 170)">fetchEntity</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)"><</span><span class="token generic-function generic class-name constant" style="color:rgb(100, 102, 149)">M</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name keyword" style="color:rgb(86, 156, 214)">extends</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">[</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)">Key</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name builtin" style="color:rgb(86, 156, 214)">string</span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">]</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> CMSType</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">FetchEntityProps</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token maybe-class-name">Entity</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token operator" style="color:rgb(212, 212, 212)">|</span><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">undefined</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">if</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token property-access">path</span><span class="token plain"> </span><span class="token operator" style="color:rgb(212, 212, 212)">===</span><span class="token plain"> </span><span class="token string" style="color:rgb(206, 145, 120)">"your_path_custom"</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token comment" style="color:rgb(106, 153, 85)">// make your custom http call and return your Entities</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">fetchEntity</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token generic-function function" style="color:rgb(220, 220, 170)">saveEntity</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)"><</span><span class="token generic-function generic class-name constant" style="color:rgb(100, 102, 149)">M</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name keyword" style="color:rgb(86, 156, 214)">extends</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">[</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)">Key</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name builtin" style="color:rgb(86, 156, 214)">string</span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">]</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> CMSType</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">SaveEntityProps</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token maybe-class-name">Entity</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">>></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">if</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token property-access">path</span><span class="token plain"> </span><span class="token operator" style="color:rgb(212, 212, 212)">===</span><span class="token plain"> </span><span class="token string" style="color:rgb(206, 145, 120)">"your_path_custom"</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token comment" style="color:rgb(106, 153, 85)">// make your custom http call and return your Entities</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">saveEntity</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token generic-function function" style="color:rgb(220, 220, 170)">deleteEntity</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)"><</span><span class="token generic-function generic class-name constant" style="color:rgb(100, 102, 149)">M</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name keyword" style="color:rgb(86, 156, 214)">extends</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">[</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)">Key</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name builtin" style="color:rgb(86, 156, 214)">string</span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">]</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">:</span><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> CMSType</span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token generic-function generic class-name" style="color:rgb(78, 201, 176)"> </span><span class="token generic-function generic class-name punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token generic-function generic class-name operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">DeleteEntityProps</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token constant" style="color:rgb(100, 102, 149)">M</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token keyword" style="color:rgb(86, 156, 214)">void</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">deleteEntity</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">props</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token function" style="color:rgb(220, 220, 170)">checkUniqueField</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">string</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> name</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">string</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> value</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">any</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> property</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">ResolvedProperty</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> entityId</span><span class="token operator" style="color:rgb(212, 212, 212)">?</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">string</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token builtin" style="color:rgb(86, 156, 214)">boolean</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">checkUniqueField</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> name</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> value</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> property</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"> entityId</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token function" style="color:rgb(220, 220, 170)">generateEntityId</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">string</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">generateEntityId</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token function" style="color:rgb(220, 220, 170)">countEntities</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> path</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token builtin" style="color:rgb(86, 156, 214)">string</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> collection</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token maybe-class-name">EntityCollection</span><span class="token punctuation" style="color:rgb(212, 212, 212)">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token operator" style="color:rgb(212, 212, 212)">:</span><span class="token plain"> </span><span class="token known-class-name class-name" style="color:rgb(78, 201, 176)">Promise</span><span class="token operator" style="color:rgb(212, 212, 212)"><</span><span class="token builtin" style="color:rgb(86, 156, 214)">number</span><span class="token operator" style="color:rgb(212, 212, 212)">></span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token keyword" style="color:rgb(86, 156, 214)">return</span><span class="token plain"> firestoreDataSource</span><span class="token punctuation" style="color:rgb(212, 212, 212)">.</span><span class="token method function property-access" style="color:rgb(220, 220, 170)">countEntities</span><span class="token punctuation" style="color:rgb(212, 212, 212)">(</span><span class="token plain">path</span><span class="token punctuation" style="color:rgb(212, 212, 212)">)</span><span class="token punctuation" style="color:rgb(212, 212, 212)">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"> </span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#9CDCFE"><span class="token plain"></span><span class="token punctuation" style="color:rgb(212, 212, 212)">}</span><br></span></code></pre><div class="buttonGroup__atx"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_eSgA" aria-hidden="true"><svg class="copyButtonIcon_y97N" viewBox="0 0 24 24"><path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg class="copyButtonSuccessIcon_LjdS" viewBox="0 0 24 24"><path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div><h2 class="anchor anchorWithStickyNavbar_LWe7" id="using-a-custom-data-source">Using a custom data source<a href="#using-a-custom-data-source" class="hash-link" aria-label="Direct link to Using a custom data source" title="Direct link to Using a custom data source">​</a></h2><p>Once you have defined your custom data source, you can use it in your custom <a href="/docs/recipes/api/interfaces/FireCMS"><code>FireCMS</code></a> instance (keep in mind that you can't use a custom data source with <code>FirebaseCMSApp</code>).</p><p>You will need to create a custom app, and use your custom data source when creating the <code>FireCMS</code> instance.</p><p>Check the <a href="/docs/custom_cms_app">Custom CMS app</a> instructions to learn how to create a custom app. Replace the <code>useFirestoreDataSource</code> hook with your custom data source.</p><div class="theme-admonition theme-admonition-tip alert alert--success admonition_LlT9"><div class="admonitionHeading_tbUL"><span class="admonitionIcon_kALy"><svg viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"></path></svg></span>tip</div><div class="admonitionContent_S0QG"><p>You can also customise in the same way the other components used internally by FireCMS.</p></div></div></div><footer class="theme-doc-footer docusaurus-mt-lg"><div class="theme-doc-footer-edit-meta-row row"><div class="col"><a href="https://github.com/FireCMSco/firecms/tree/website/website/docs/recipes/custom_datasource.mdx" target="_blank" rel="noreferrer noopener" class="theme-edit-this-page"><svg fill="currentColor" height="20" width="20" viewBox="0 0 40 40" class="iconEdit_Z9Sw" aria-hidden="true"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div><div class="col lastUpdated_vwxv"></div></div></footer></article><nav class="pagination-nav docusaurus-mt-lg" aria-label="Docs pages navigation"><a class="pagination-nav__link pagination-nav__link--prev" href="/docs/recipes/copy_entity"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">Copying from another collection</div></a><a class="pagination-nav__link pagination-nav__link--next" href="/docs/recipes/documents_as_subcollections"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Dynamic root collections</div></a></nav></div></div><div class="col col--3"><div class="tableOfContents_bqdL thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#custom-data-sources" class="table-of-contents__link toc-highlight">Custom data sources</a></li><li><a href="#example-custom-datasource" class="table-of-contents__link toc-highlight">Example custom datasource</a></li><li><a href="#using-a-custom-data-source" class="table-of-contents__link toc-highlight">Using a custom data source</a></li></ul></div></div></div></div></main></div></div><section class="relative"><div class="mx-auto px-4 sm:px-6 bg-primary text-white"><div class="relative flex flex-col items-center px-6 py-12"><h4 class="h2 my-4 text-white uppercase">Enterprise?</h4><div class="flex flex-col space-y-2 items-center text-lg"><div class="text-center mb-4">Learn how to get the most out of your project with the help of our consulting team.</div><a href="/enterprise" class="btn mx-auto sm:mb-0 py-4 bg-black text-white hover:text-white uppercase border border-solid w-full sm:w-auto rounded">Learn more</a></div><div class="flex flex-wrap"><div class="w-full py-2 border-b-2 border-gray-400 flex justify-between gap-2"></div></div></div></div></section><section class="relative"><div class="mx-auto px-4 sm:px-6 bg-gray-200 dark:bg-gray-800"><div class="relative flex flex-col items-center px-6 py-16"><div><div class="flex flex-col space-y-2 mb-4 text-lg"><strong> Sign up to our newsletter to get the latest news and updates. No spam!</strong></div><div class="flex flex-wrap"><form><label class="w-full flex items-baseline gap-3 text-sm"><input type="checkbox" value="policy-read"><span>By subscribing to our newsletter, you acknowledge you have read, and agree to <a href="/privacy_policy" class="underline">our personal data policy</a>.</span></label><div class="w-full py-2 flex justify-between gap-2"><input class="appearance-none outline-none text-xl flex-1 px-4 py-4 bg-gray-100 dark:bg-gray-900 rounded w-full leading-tight focus:border-primary border-none" id="email" type="email" placeholder="Enter your email"><button type="submit" disabled="" class="btn px-8 py-4 sm:px-12 sm:py-4 uppercase w-auto sm:mb-0 sm:ml-2 bg-gray-200 dark:bg-gray-800">Sign up</button></div></form></div></div></div></div></section><footer class="footer"><div class="container container-fluid"><div class="row footer__links"><div class="col footer__col"><div class="footer__title">Get in touch</div><ul class="footer__items clean-list"><li class="footer__item"><a href="mailto: hello@firecms.co" target="_blank" rel="noopener noreferrer" class="footer__link-item">Contact<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div><div class="col footer__col"><div class="footer__title">Links</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/enterprise">Enterprise</a></li><li class="footer__item"><a href="https://app.firecms.co/subscriptions" target="_blank" rel="noopener noreferrer" class="footer__link-item">Manage subscriptions</a></li><li class="footer__item"><a href="https://demo.firecms.co" target="_blank" rel="noopener noreferrer" class="footer__link-item">Demo</a></li><li class="footer__item"><a class="footer__link-item" href="/blog">Blog</a></li><li class="footer__item"><a class="footer__link-item" href="/policy/privacy_policy">Privacy policy</a></li><li class="footer__item"><a class="footer__link-item" href="/policy/terms_conditions">Terms and conditions</a></li><li class="footer__item"><a class="footer__link-item" href="/policy/cookies_policy">Cookies policy</a></li></ul></div><div class="col footer__col"><div class="footer__title">Community</div><ul class="footer__items clean-list"><li class="footer__item"><a href="https://discord.gg/fxy7xsQm3m" target="_blank" rel="noopener noreferrer" class="footer__link-item">Discord<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li><li class="footer__item"><a href="https://github.com/FireCMSco/firecms" target="_blank" rel="noopener noreferrer" class="footer__link-item">Github<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div><div class="col footer__col"><div class="footer__title"></div><ul class="footer__items clean-list"><li class="footer__item"> <iframe src="https://discordapp.com/widget?id=1013768502458470442&theme=dark" width="300" height="300" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts">