Code Monkey home page Code Monkey logo

gateway-client-reliability-dashboard's Introduction

SMSWithoutBorders Dashboard

Welcome to the SMSWithoutBorders Dashboard, a powerful tool designed to measure the reliability of gateway clients and available gateway servers.

Getting Started

To get started with the SMSWithoutBorders Dashboard, follow these simple steps:

  1. Create .env File: Create a .env file in the root directory of the project. Add variables:
REACT_APP_RELIABILITY_URL=# reliability data source (replace with actual URL)
REACT_APP_RESILIENCE_URL=# resilience data source (replace with actual URL)

Note

Please ensure to replace the placeholders with real URLs pointing to your reliability and resilience data sources.

  1. Install Dependencies: Run the following command to install dependencies:

    yarn install
    
  2. Start the Application: Once the dependencies are installed, start the application by running:

    yarn start
    

Data Structure

Reliability

[
	{
		"country": "United States of America",
		"operator": "Verizon Wireless",
		"countrycode": "US",
		"resilience": "4",
		"date": "2068-11-07T13:46:36.446Z",
		"msisdn": "+1-756-699-4569 x28073",
		"testdata": [
			{
				"test_id": "1",
				"sent_time": "14:00:00",
				"sms_sent": "14:05:00",
				"sms_received": "14:10:00",
				"published": "14:15:00",
				"operator_difference": "00:05:00",
				"publisher_difference": "00:05:00",
				"total_difference": "00:10:00"
			},
			{
				"test_id": "2",
				"sent_time": "15:00:00",
				"sms_sent": "15:05:00",
				"sms_received": "15:10:00",
				"published": "15:15:00",
				"operator_difference": "00:05:00",
				"publisher_difference": "00:05:00",
				"total_difference": "00:10:00"
			}
		],
		"id": "1"
	},
	{
		"country": "Kyrgyz Republic",
		"operator": "MegaCom",
		"countrycode": "KG",
		"resilience": "3",
		"date": "2071-05-10T06:29:23.635Z",
		"msisdn": "+996-859-809-9556",
		"testdata": [
			{
				"test_id": "1",
				"sent_time": "06:45:00",
				"sms_sent": "06:50:00",
				"sms_received": "06:55:00",
				"published": "07:00:00",
				"operator_difference": "00:05:00",
				"publisher_difference": "00:05:00",
				"total_difference": "00:10:00"
			},
			{
				"test_id": "2",
				"sent_time": "07:45:00",
				"sms_sent": "07:50:00",
				"sms_received": "07:55:00",
				"published": "08:00:00",
				"operator_difference": "00:05:00",
				"publisher_difference": "00:05:00",
				"total_difference": "00:10:00"
			}
		],
		"id": "2"
	}
]

Resilience

[
	{
		"msisdn": "875-808-2812",
		"country": "Paraguay",
		"operator": "Handmade Steel Towels",
		"resilience": "New Jersey",
		"regdate": 1712062353,
		"duration": "2093-02-09T16:23:41.760Z",
		"success": 67,
		"failure": 49,
		"error": false,
		"id": "1"
	},
	{
		"msisdn": "986-647-7185",
		"country": "Bermuda",
		"operator": "Oriental Wooden Soap",
		"resilience": "New York",
		"regdate": 1712062293,
		"duration": "2029-07-25T17:23:12.167Z",
		"success": 0,
		"failure": 6,
		"error": false,
		"id": "2"
	},
	{
		"msisdn": "532-992-5995",
		"country": "Saint Helena",
		"operator": "Bespoke Granite Shirt",
		"resilience": "Arkansas",
		"regdate": 1712062233,
		"duration": "2082-02-24T02:19:01.931Z",
		"success": 91,
		"failure": 43,
		"error": false,
		"id": "3"
	},
	{
		"msisdn": "803-965-0820",
		"country": "Guernsey",
		"operator": "Small Rubber Bike",
		"resilience": "Mississippi",
		"regdate": 1712062173,
		"duration": "1999-01-06T07:14:56.889Z",
		"success": 87,
		"failure": 18,
		"error": false,
		"id": "4"
	},
	{
		"msisdn": "554-915-2287",
		"country": "Norfolk Island",
		"operator": "Practical Steel Pants",
		"resilience": "Mississippi",
		"regdate": 1712062113,
		"duration": "2094-01-10T13:44:40.264Z",
		"success": 8,
		"failure": 28,
		"error": false,
		"id": "5"
	},
	{
		"msisdn": "420-639-5991",
		"country": "Kyrgyz Republic",
		"operator": "Luxurious Bronze Pants",
		"resilience": "Florida",
		"regdate": 1712062053,
		"duration": "1999-05-07T21:56:33.066Z",
		"success": 77,
		"failure": 32,
		"error": false,
		"id": "6"
	},
	{
		"msisdn": "418-775-2188",
		"country": "Serbia",
		"operator": "Ergonomic Fresh Cheese",
		"resilience": "Nebraska",
		"regdate": 1712061993,
		"duration": "2005-10-25T12:29:19.393Z",
		"success": 66,
		"failure": 48,
		"error": false,
		"id": "7"
	}
]

Tools Used

The SMSWithoutBorders Dashboard utilizes the following tools and libraries:

  • React: A JavaScript library for building user interfaces.

  • Material-UI (Mui): A popular React UI framework that implements Google's Material Design

.

  • Material-UI Data Grid: An extension of Material-UI providing a powerful data grid component for React applications.

  • React Icons: A collection of popular icons for React projects.

gateway-client-reliability-dashboard's People

Contributors

promisefru avatar vanessa-kris avatar mildrette avatar

Watchers

 avatar

Forkers

mildrette

gateway-client-reliability-dashboard's Issues

Typos

Where it says "Gateway Servers" should be "Gateway Clients"
Where it says "Resiliance" should be "Resilience"

Enable Gateway Client Reliability Test Tables to Fetch Test Data via API

Currently, the gateway client reliability test tables cannot make API calls to fetch test data when visited. Instead, the data is fetched from the initial gateway client's data and passed as a state to the test table, which isn't efficient for managing the tests independently. This functionality is crucial for ensuring the test data can be refreshed when needed.

Add Ability For Tables to Display Unix Time

Currently, the dashboard cannot display Unix time in tables, which limits the usability and flexibility of data presentation. When presented with a Unix time string, it displays the string rather than the human-readable version of it.

image

Add column for protocols

There is no column for protocols
The columns for routed, success, and failure can be merged to one column

[Priority: High] Implement No Data Handling for Dashboard Tables

Currently, the dashboard tables do not handle cases where there is no data available gracefully. When attempting to fetch data and encountering an empty dataset, the dashboard breaks, failing to display any information to the user.

Expected Behavior:

  • When fetching data for a dashboard table, if no data is available, the table should gracefully inform the user that no data is present.
  • The dashboard should remain functional even when encountering empty datasets, ensuring a seamless user experience.

Proposed Solution:

  • Implement a mechanism within the dashboard's table component to detect when no data is returned from the backend.
  • Display a visually clear message within the table indicating that no data is available.
  • Ensure that this message does not disrupt the overall layout or functionality of the dashboard.

Steps to Reproduce:

  1. Navigate to the dashboard containing tables.
  2. Ensure that there is no data available for the table.
  3. Observe the behaviour of the dashboard when attempting to display the empty dataset.

Lack of information

There is currently a lack of information informing what happens at each of the Telemetry screens.
Things to include

  • Helpful information on what is reliability and how it's measure
  • Helpful information on what is resilience and what it measures

Implement Passing Pagination and Filter Values from Table Components to API Calls

Currently, the table component handles pagination and filtering on the client side. However, this approach can lead to increased client-side processing and potentially slower performance, especially when dealing with large datasets. We should enhance the table component to pass pagination and filter values directly to the API call to optimise performance and reduce client-side workload.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.