@odx/product-fruits NPM

@odx/product-fruits

Install 🚀

npm install @odx/product-fruits

⚠️ Note: @odx/product-fruits includes everything you need. Avoid installing npm install product-fruits separately, as it may cause issues.

Usage

Setup product fruits by initializing it's enviroment providers with provideProductFruits inside the applications providers array:

import { provideProductFruits } from '@odx/product-fruits';

bootstrapApplication(AppComponent, {
  providers: [
    // ...
    provideProductFruits(/* ...options */),
  ],
});

Newsfeed

In order to setup the newsfeed UI add the ProductFruitsNewsFeedDirective to your imports and use it in the HeaderComponent:

<odx-header>
  <odx-action-group>
    <button odxButton odxProductFruitsNewsfeed></button>
  </odx-action-group>
</odx-header>

The newsfeed button will be disabled if product fruits failed to initialize.

Legacy LifeRing

Deprecated - ProductFruitsLifeRingDirective no longer supports legacy LifeRing. If you had collections of help articles created for the earlier version, you can easily migrate them to v2 in the PF admin app.

LifeRing v2

If you have the basic setup of help articles in your PF admin, the default lifering floating button will appear itself on your webpage - thats all.

However, in order to setup the alternative lifering trigger button, add the ProductFruitsLifeRingDirective to your imports and use it in the HeaderComponent. This will automatically hide the floating button, but it is also recommended to turn it off in your PF configuration.

<odx-header>
  <odx-action-group>
    <button odxButton odxProductFruitsLifeRing></button>
  </odx-action-group>
</odx-header>

provideProductFruits(() => ({
  language: 'en',
  user: { username: 'TEST_USER' },
  workspaceCode: 'your_workspace_code'
  hideInAppCenterLauncher: true, // <-- add this
})),