This project is like a handy widget you can plug into other websites. It's built with React and gives users quick access to important project stuff like documentation, APIs, contact info, and more.
In the project directory, you can run:
Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
This generates the dist folder and under it you will find the UMD and ESM libraries.
Creates a static website version of the app where you can test the Widget This process generates a build folder containing the necessary files and can be deployed in services like S3 Bucket.
The pipelines will be triggered every time you push a new tag. To do that, you can run the following commands (Substitute the x values for numbers):
git tag vx.x.x
git push --tagsThis will upload the latest version of your app to the s3://widget.osirus.ai bucket. You can then access the widget file at https://bot.osirus.ai/lib/umd/osirusai.min.js.
You can easily set up the widget by adding the following script just before the closing </body> tag in your HTML:
<script src="https://bot.osirus.ai/lib/umd/osirusai.min.js" type="text/javascript"></script>
<script type="text/javascript">
OsirusaiWidget.init({
companyName: '{ company_name }',
intercomId: '{ intercom_chat_id }',
phoneNumber: '{ phone_number }',
info: {
hours: '{ hours }', // eg: 'M - F, 8:30AM - 5:30PM EDT'
email: '{ company_email }',
address: '{ company_address }',
}
});
</script>Coming soon...
To preview your changes in an environment resembling the production setup, follow these steps:
- Start by running
npm run buildto generate the necessary build files. - Once the build process is finished, open
test/index.htmlin your preferred web browser. - You should now be able to see the widget displayed within a blank website, allowing you to assess how your changes will appear in a production-like setting.