Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@akinon/app-client

Package Overview
Dependencies
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@akinon/app-client

Akinon AppClient library. This library is used to create a new plugin or an application which will reside in Akinon's applications.

  • 0.5.3
  • npm
  • Socket score

Version published
Weekly downloads
36
increased by260%
Maintainers
1
Weekly downloads
 
Created
Source

Akinon App Client Library

The app-client library provides a React context and hooks for integrating micro-frontend applications with the main application shell, enabling actions like navigation, displaying modals, and other inter-app communications.

Installation

To add the app-client library to your project, run:

pnpm install @akinon/app-client

Usage

First, wrap your micro-frontend's root component with the AppClientProvider:

import React from 'react';
import ReactDOM from 'react-dom';
import { AppClientProvider } from '@akinon/app-client';
import App from './App';

ReactDOM.render(
  <AppClientProvider config={{ isDev: true }}>
    <App />
  </AppClientProvider>,
  document.getElementById('root')
);

Then, use the useAppClient hook within your components to access client functionalities:

import React from 'react';
import { useAppClient } from '@akinon/app-client';

const MyComponent = () => {
  const { navigate } = useAppClient();

  return <button onClick={() => navigate('/path')}>Go somewhere</button>;
};

API

AppClientProvider

Props:

  • config: Configuration for the client application, including isDev and forceRedirect.

useAppClient Hook

Provides access to:

  • navigate(path: string): Function to navigate to a different route.
  • invokeAction(actionKey: string, ...args: any[]): Invoke a custom action defined in the app shell.
  • Helper functions for showing modals, toasts, and more.
  • data: Data shared by host applications.

Configuration

The AppClientProvider accepts the following configuration options:

  • isDev: Enables development mode.
  • forceRedirect: Forces the application to load in an iframe if not already.

For more information on configuration and usage, please refer to the detailed documentation.

FAQs

Package last updated on 05 Apr 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc