{"id":19069265,"url":"https://github.com/blazerroadg/js-frontend-repository","last_synced_at":"2025-07-18T16:37:40.780Z","repository":{"id":57282835,"uuid":"300452759","full_name":"blazerroadg/js-frontend-repository","owner":"blazerroadg","description":"The Repository pattern is a well-documented way of working with a data source. In this library I used this pattern for manage API calls from javascript base frontend applications","archived":false,"fork":false,"pushed_at":"2024-04-15T14:27:01.000Z","size":605,"stargazers_count":23,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-27T14:05:41.374Z","etag":null,"topics":["abstraction","api","apicall","azure-cosmos","codegenerator","defaultentity","entity","firestore","firestore-database","fronend","javascript","react","react-native","redux","respository","service-facad","solid-principles"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/blazerroadg.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-10-01T23:41:38.000Z","updated_at":"2024-12-29T02:09:13.000Z","dependencies_parsed_at":"2024-04-15T15:31:06.298Z","dependency_job_id":"0a687f90-7a9a-4caf-ab97-62499f1446d7","html_url":"https://github.com/blazerroadg/js-frontend-repository","commit_stats":{"total_commits":46,"total_committers":3,"mean_commits":"15.333333333333334","dds":0.5434782608695652,"last_synced_commit":"d4bb39d3fe58a0f4de8b02707530a5bf8b5d5b84"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/blazerroadg/js-frontend-repository","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blazerroadg%2Fjs-frontend-repository","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blazerroadg%2Fjs-frontend-repository/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blazerroadg%2Fjs-frontend-repository/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blazerroadg%2Fjs-frontend-repository/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blazerroadg","download_url":"https://codeload.github.com/blazerroadg/js-frontend-repository/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blazerroadg%2Fjs-frontend-repository/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264287234,"owners_count":23585203,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["abstraction","api","apicall","azure-cosmos","codegenerator","defaultentity","entity","firestore","firestore-database","fronend","javascript","react","react-native","redux","respository","service-facad","solid-principles"],"created_at":"2024-11-09T01:13:49.744Z","updated_at":"2025-07-18T16:37:40.746Z","avatar_url":"https://github.com/blazerroadg.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\nMap\u003cString, String\u003e customData = new HashMap\u003c\u003e();\n        customData.put(\"CUSTOM_DATA_KEY\", \"{\\\"WIDGET_ID_KEY\\\":\\\"expectedWidgetId\\\"}\");\n\n\nimport static org.mockito.Mockito.*;\n\nConsumerRecord\u003cString, PushProcessorEvent\u003e mockRecord = mock(new TypeToken\u003cConsumerRecord\u003cString, PushProcessorEvent\u003e\u003e(){}.getRawType());\n\nimport static org.junit.Assert.*;\nimport static org.mockito.Mockito.*;\n\nimport org.json.JSONObject;\nimport org.junit.Test;\n\npublic class MessageStoreUtilTest {\n\n    @Test\n    public void testShouldStoreMessage_WithMatchingAppKey_ReturnsTrue() {\n        // Arrange\n        String incomingAppKey = \"appKey\";\n        PushProcessorEvent event = mock(PushProcessorEvent.class);\n        when(event.getAppUID()).thenReturn(incomingAppKey);\n        when(event.getData()).thenReturn(null);\n        \n        // Act\n        boolean result = MessageStoreUtil.shouldStoreMessage(incomingAppKey, event);\n\n        // Assert\n        assertTrue(result);\n    }\n\n    @Test\n    public void testShouldStoreMessage_WithCustomDataAndMatchingWidgetId_ReturnsTrue() {\n        // Arrange\n        JSONObject customData = new JSONObject();\n        customData.put(\"WIDGET_ID_KEY\", \"expectedWidgetId\");\n        \n        PushProcessorEvent event = mock(PushProcessorEvent.class);\n        when(event.getData()).thenReturn(customData);\n        when(event.getAppUID()).thenReturn(\"differentAppKey\");\n        \n        // Act\n        boolean result = MessageStoreUtil.shouldStoreMessage(\"appKey\", event);\n\n        // Assert\n        assertTrue(result);\n    }\n\n    @Test\n    public void testShouldStoreMessage_WithNonMatchingConditions_ReturnsFalse() {\n        // Arrange\n        PushProcessorEvent event = mock(PushProcessorEvent.class);\n        when(event.getAppUID()).thenReturn(\"differentAppKey\");\n        when(event.getData()).thenReturn(null);\n        \n        // Act\n        boolean result = MessageStoreUtil.shouldStoreMessage(\"appKey\", event);\n\n        // Assert\n        assertFalse(result);\n    }\n    \n    // Additional tests can be added to cover other branches and edge cases\n}\n\n\n\n# js-frontend-repository\n  The Repository pattern is a well-documented way of working with a data source. In this library I used this pattern for manage API calls from javascript base frontend applications\n\n# Benefits\n\n- It centralizes API calls\n- It gives a substitution point for the unit tests.\n- Provides a flexible architecture\n- It reduces redundancy of code\n- It force programmer to work using the same pattern\n- If you use this pattern then it is easy to maintain the centralized data access logic\n- centralized API call \n- centralized error handeling\n- Can use diffrents API Gatways in same project with no change in Service level\n- Adding SOLID principals to your project\n\n\n# Diagram\n  \u003cimg width=800 title=\"repository diagram\" src=\"https://github.com/blazerroadg/js-frontend-repository/blob/master/assests/repositoryarch.jpg\"\u003e\n  \n# Install\n\n```bash\nnpm i js-frontend-repository \n```\n# How to use it\n  \u003cimg width=800 title=\"repository diagram\" src=\"https://github.com/blazerroadg/js-frontend-repository/blob/master/assests/repositoryworkfollow.jpg\"\u003e\n  \n## Models\nFor each API call response you should add a model based on data you fetched from API for example if I want to fetch Todo list from API with properties of title and isDone you should add a model like this : \n\n```javascript\nexport class Todo {\n    title? : string;\n\n    isDone? : boolean;\n}\n```\n\n## IRepository\nFor each model you should add one generic IRepository model of that entity, this Interface will be use on Service concretes of the entity and with help of this IRepository you can avoid changes in Service layer if you want to change Repository layer\n\n```javascript\nimport { IRepository } from 'js-frontend-repository/interfaces/IRepository';\nimport { Todo } from '@/src/models/Todo';\n\nexport interface ITodoRepository extends IRepository\u003cTodo\u003e {\n}\n\n```\n\n## Repository concrete\n\nThis file will contain all logic related to API calls for example if you are using GraphQL API, all queries should be developed in this class. Or if you are using Firestore API all related queries should be developed in this class. \n\nUsually instead of inherit from IRepository in this class it is better practice to inherit from one base repository.\ncurrent project have already three base repository developed, you can use this base repository in scenario you want to fetch data against Firestore , Azure Cosmos  or Azure Cosmos Graph Gremlin if you want to use another service or your own custom API call you should develop the base Repository related to that first \n\nFor more information about implemented Repository base class please refer to each Repository base page : \n\n- \u003ca href=\"https://github.com/blazerroadg/js-frontend-repository/tree/master/src/firestore\"\u003e Firestore Repository base \u003c/a\u003e\n- \u003ca href=\"https://github.com/blazerroadg/js-frontend-repository/tree/master/src/azureCosmos\"\u003e Azure cosmos and Azure cosmos Gremlin Repository base \u003c/a\u003e\n\n```javascript\n\nimport { FirestoreRepository } from 'react-native-firesotre-repository/FirestoreRepository';\nimport { Todo } from '@/src/models/Todo';\nimport { FirestoreEntityMetaData } from 'react-native-firesotre-repository/FirestoreEntityMetaData';\nimport { FirestoreEntityMetaDataContext } from 'react-native-firesotre-repository/FirestoreEntityMetaDataContext';\n\nexport class TodoRepository extends FirestoreRepository\u003cTodo\u003e {\n  constructor() {\n    super(Todo, new FirestoreEntityMetaData(new FirestoreEntityMetaDataContext()));\n  }\n}\n```\n\nyou can find example project : \u003ca href=\"https://github.com/blazerroadg/js-frontend-repository/tree/master/example/repository\"\u003eHere\u003c/a\u003e\n\n## Service\nFor each entity you should add one service class too. Service class is responsible for logic across one entity, for example if you want to fetch Todo with Id = 2 and then change the isDone to true and update the result you should develop the logic of that in this class.\nService is for logic across one entity, and Repository class is for query of those logic.\n\n```javascript\nimport { ITodoRepository } from '@/src/repositories/interfaces/ITodoRepository';\nimport { Todo } from '@/src/models/Todo';\nimport { BaseService } from 'js-frontend-repository/BaseSerivce';\n\nexport class TodoService extends BaseService\u003cTodo, ITodoRepository\u003e {\n    async updateTodo(id: string) {\n        const todo = await (await this.repository.getById(id)).entity;\n        todo.isDone = true;\n        await this.repository.update(todo)\n    }\n}\n\n```\nAs you can see if you change the repository behind the Todo model this file will not change \n\n## UnitOfWork.ts\nThis singleton file holds all instances of services, and also in this file you can assign a concert repository for each service. With help of this file you can change the repository of services easily and this change will not need to change any logic on service and other layers of application.\n\n```javascript\n// new service import placeholder\n// new service import placeholder\nimport { TodoRepository } from '@/src/repositories/concretes/TodoRepository';\nimport { TodoService } from '@/src/services/TodoService';\n\nexport class UnitOfWork {\n  // new service placeholder\n  todoService: TodoService\n\n  private static innerInstance: UnitOfWork;\n\n  public static instance(): UnitOfWork {\n    if (!UnitOfWork.innerInstance) {\n      UnitOfWork.innerInstance = new UnitOfWork();\n    }\n    return UnitOfWork.innerInstance;\n  }\n\n  private constructor() {\n    // new service init placeholder\n    this.todoService = new TodoService(TodoRepository);\n  }\n}\n```\n\n# Code Generator\nAs you can see for adding new Entity in the repository pattern you have to add 3 files and modify one, to develop faster and avoid duplicate work you can use the “Repository Code Generator” package. \n\n## Install\n\n```bash\nnpm i -g rpcodegen\n```\n\nFor more information please see Repository Code Generator page  : \n\u003ca href=\"https://github.com/blazerroadg/js-frontend-repository/tree/master/src/codegenerator\" \u003eRepository Code Generator\u003c/a\u003e\n\n\n# Redux\nIf you want to use Redux in your application and you want to manage the API call with repository pattern and automatically dispatch them on State and also if your looking for better solution to design your Actions and Routers in Redux you can use this package \n\n```bash\nnpm i react-redux-repository\n```\n\nFor more information ablut Redux Repository please visit: \n\u003ca href=\"https://github.com/blazerroadg/js-frontend-repository/tree/master/src/redux\" \u003eReact Redux Repository\u003c/a\u003e\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblazerroadg%2Fjs-frontend-repository","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblazerroadg%2Fjs-frontend-repository","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblazerroadg%2Fjs-frontend-repository/lists"}