Takala - client package
@takala/client is lightweight, generic solution to all your error handling.
Installation
Use npm to install @takala/client.
npm install @takala/client
Usage
ReactJS
Simple usage
n your main file index.js
initiate using Tk.initiate
import React from "react";
import ReactDOM from "react-dom";
import Tk from "@takala/client";
import App from "./app";
Tk.initiate("--YOUR TAKALA TOKEN--");
ReactDOM.render(<App />, document.getElementById("root"));
handle Tk.identify
import Tk from "@takala/client";
Tk.identify({ username: "takala-dev", innerId: 2 });
In your app you can trigger Takala handlers with Tk.set
import {useEffect} from 'react'
import axios from 'axios'
import Tk from '@takala/client'
export const App = () => {
useEffect(()=>{
axios.get('some api url').then((response)=>{
if (response.status == 200){
// handle your happy flow
}else{
// let us handle the error for you
Tk.set(response,callback)
}
}).catch(err=>{
// let us handle the error for you
Tk.set(err,callback)
})
},[])
return (
<div>
{* YOUR JSX CODE *}
</div>
)
}
With callback
import React from 'react'
import axios from 'axios'
import Tk from '@takala/client'
const App = () => {
const handleFallback = (data) => {
//send the data you collect using takala to your api
}
// just pass the callback to Tk.set() function as second parameter
useEffect(()=>{
axios.get('some api ur',(response)=>{
if(response.status == 200){
//handle your happy flow
}else{
Tk.set(response,handleFallback) // we will do the rest
}
}).catch(err=>{
Tk.set(err,handleFallback)
})
},[])
return (
<div>
{* your jsx *}
</div>
)
}
You can finish your flow by measuring success with Tk.success
import React from "react";
import Tk from "@takala/client";
export const SuccessMessage = () => {
useEffect(() => {
// let us know your flow is done successfuly
Tk.success();
}, []);
return (
<div>
Congratulations!🎉🎉 we got you application
<br />
We will reach you by email in the next 2 days.
</div>
);
};
Angular
In your main file app.component.js
initiate using Tk.initiate
import { Component, OnInit } from "@angular/core";
import { UserService } from "./core";
import Tk from "@takala/client";
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
})
export class AppComponent implements OnInit {
constructor(private userService: UserService) {}
ngOnInit() {
Tk.initiate('--YOUR TAKALA TOKEN--');
this.userService.populate();
}
}
handle Tk.identify
import Tk from "@takala/client";
Tk.identify({ username: "takala-dev", innerId: 2 });
In your app you can trigger Takala handlers with Tk.set
//header.component.html
<button (click)="handleTakala()">takala</button>
//header.component.ts
import Tk from "@takala/client";
handleTakala() {
Tk.set(/*YOU ERROR PAYLOAD*/);
}
You can finish your flow by measuring success with Tk.success
//successPopup.component.ts
import Tk from "@takala/client";
export class SuccessPopupComponent implements OnInit {
constructor() {}
ngOnInit() {
Tk.success();
}
}