npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@evo/chat-prom-desktop

v0.15.10

Published

prom desktop chat view mechanizm

Downloads

377

Readme

Desktop view package of @evo chat, with main data control module @evo/chat-core. All styles, images and translations are in build, so u don't need to worry about. It`s easy to mount, and push/subscribe on the events, through BesidaChat class. To quick start , follow basic usage guide.

Installation

npm install --save -E @evo/chat-prom-desktop

Basic Usage

On DOM node rendering

import { getUserInfo, init as initUserFetch } from '@evo/user-info';
import { BesidaChat } from '@evo/chat-prom-desktop';

// if u already have user, this step is unnecessary
initUserFetch(window.location.host);

let userInfo = {};

try { userInfo = await getUserInfo(); }
catch (_) { userInfo = null; }

if (userInfo && userInfo.id) {
    config.initAppData.user_id = userInfo.id;
}

// some root node to mount in
const besidaRoot = document.getElementById('besida');

// it`s important to know, are u a company or a buyer
const userRoles = BesidaChat.userRoles/*.(company|buyer)*/;

const besidaObj = new BesidaChat(
    initAppData, // base data for app to run, like context, theme, etc
    config, // includes flags and temp deps to inject, like analytics
    userRoles.buyer, 
    besidaRoot
);

For SPA like

In case u have mwa, first steps for init chat is similar to on DOM node rendering, except u must omit last node param.

import React from 'react';

const besidaObj = new BesidaChat(
    initAppData,
    config,
    userRoles.buyer
);

const BesidaChatApp = besidaObj.chatAppComponent;

class AwesomeApp extends React.Component {
    render() {
        return (
            <React.Fragment>
                <Header />
                <Body> {BesidaChatApp} </Body>
                <Footer />
            </React.Fragment>
        );
    }
}

Subscribing/pushing events

Once u create a valid BesidaChat instance, u can import it in any numbers of ur modules, it`ll be the same chat, u have created on ur app start.

BesidaChat.instance.dispatchEvent('openDialog', params || { node: target });

U can pick, from public actions list, for now there are: openDialog - open chat window, if u want to open room with cntx send, u should give this obj as arg:

const params = {
    theme: '345345_buyer' // first part, before `_` is company id
    // rest is product data, u want to see in cntx msg
    contextItemId: 456234,
    contextItemType: 'product',
    contextItemPrice: '100.34',
    contextItemCurrency: 'грн',
    contextDescription: 'Magic gout`s lag',
    contextMeta: 'prosaleHashe'
}

openRoom - open direct chat room, takes one arg roomIdent, setLocale - change actual language, takes one of languages in same name static field.

Methods of subscription are static, coz u may not know the order of components to init, but u want for some reason, to add callback function right in that place. U are free to do this:

const removeLister = BesidaChat.addInitListener(() => /* Doing stuff here */void 0);
//it`s actual for SPA to remove event listeners on page change, in case u do not have chat there
// or some other reason, u just call returned remove lister with bind index on ur func
removeLister();

There are one more method for subscribing, addUpdateListener, it`s conveniently to use, when u need to sync state with some outer components.

Init app data, flags and deps

List of all required and custom properties u should provide to Chat.

Config

{
    // from CS config
    promConfig: {
        // urls, used for HTTP transports
        defaultOrigin,
        currentDomain,
        portalHomePage,
        personalDataProcessDoc,
        komoraUrl,
    
        //boolean data
        besidaIsMobile,
        userIsSudoMode,
        isRuprom,
        isBelprom,
        isKzprom,
        isDebug,
    
        // page depends data
        defaultCurrencyText
    
        // feature flags
        coreBesidaRoomBan,
        vasNewRussianPolicyLaw,
        contentPowerEnabled,
        coreBesidaImageUpload,
        coreBannedSKKNotification,

        // inited Swindon connection object getter and connection status callback
        getSocketConnectionObj, 
        addStateCallback,
    },

    tempDeps: {
        // All of this deps will be removed,
        // as soon as they will get packges
        FormTracker,
        tracking
    }
}

initAppData

{
    auto_knock_knock, // room auto join `url`, u can look in Besida serv, how it`s formed
    user_id, // user ident, if u have it
    onPortal, // boolean statement
    withoutButton, // boolean statement, don't render button in mount node
    userHasCompany, // boolean statement
    userHasC2CCompany, // boolean statement
    context_item_id, // product params, for cntx send
    context_item_type,
    context_item_price, 
    context_item_currency,
    context_description,
    context_meta,
    social_auth, // list of obj, for social auth
    theme, // room ident, `${oponentId}_${role}`
    isInBuyerCabinet, // boolean, buyer is under /cabinet url, but basicly it`s client chat
    pageType, // from AppState, for analytics
    device, initialAppData.isMobile ? 'phone' : 'desktop' // for analytics
    locale initialAppData.locale || c.DEFAULT_LOCALE, // u can set start up locations, from static languages list
}