Skip to content

Commit

Permalink
Add freshdesk widget component
Browse files Browse the repository at this point in the history
  • Loading branch information
akeldamas committed Nov 3, 2024
1 parent bfff228 commit b63efdb
Show file tree
Hide file tree
Showing 8 changed files with 108 additions and 8 deletions.
1 change: 1 addition & 0 deletions apps/rda/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
"@dans-framework/theme": "workspace:*",
"@dans-framework/user-auth": "workspace:*",
"@dans-framework/utils": "workspace:*",
"@dans-framework/freshdesk": "workspace:*",
"@fontsource/roboto": "^5.0.7",
"@mui/icons-material": "^5.14.3",
"@mui/material": "^5.16.7",
Expand Down
2 changes: 2 additions & 0 deletions apps/rda/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import authProvider from "./config/auth";
import form from "./config/form";
import { elasticConfig } from "./config/elasticSearch";
import { FacetedWrapper, FacetedSearchProvider } from "@dans-framework/rdt-search-ui";
import { Freshdesk } from "@dans-framework/freshdesk"

const App = () => {
const { i18n } = useTranslation();
Expand Down Expand Up @@ -101,6 +102,7 @@ const App = () => {
</BrowserRouter>
</FacetedSearchProvider>
<Footer {...footer} />
<Freshdesk widgetId={80000010123} />
</ThemeWrapper>
</AuthWrapper>
);
Expand Down
1 change: 1 addition & 0 deletions packages/freshdesk/lib/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { default as Freshdesk } from "../src/freshdesk";
13 changes: 13 additions & 0 deletions packages/freshdesk/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"name": "@dans-framework/freshdesk",
"type": "module",
"private": true,
"main": "lib/index.tsx",
"dependencies": {
"react": "^18.2.0"
},
"devDependencies": {
"@dans-framework/typescript-config": "workspace:*",
"@types/react": "^18.2.15"
}
}
13 changes: 13 additions & 0 deletions packages/freshdesk/src/freshdesk.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import React from "react";
import { useFreshworksWidget } from "./useFreshworksWidget";

export interface FreshworksWidgetProps {
widgetId: number;
}

const Freshdesk: React.FC<FreshworksWidgetProps> = ({ widgetId }) => {
useFreshworksWidget(widgetId);
return null;
};

export default Freshdesk;
45 changes: 45 additions & 0 deletions packages/freshdesk/src/useFreshworksWidget.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import { useEffect } from "react";

const WIDGET_URL = "https://euc-widget.freshworks.com/widgets/";

export interface FreshworksSettings {
widget_id: number;
}

export interface FreshworksWidgetFunction {
(...args: any[]): void;
q?: any[];
}

export const useFreshworksWidget = (widgetId: number) => {
useEffect(() => {
const w = window as unknown as {
fwSettings?: FreshworksSettings;
FreshworksWidget?: FreshworksWidgetFunction;
};

w.fwSettings = {
widget_id: widgetId,
};

if (typeof w.FreshworksWidget !== "function") {
const n = function (this: any, ...args: any[]) {
n.q?.push(args);
} as FreshworksWidgetFunction;
n.q = [];
w.FreshworksWidget = n;
}

const script = document.createElement("script");
script.src = WIDGET_URL + widgetId + ".js";
script.async = true;
script.defer = true;
document.body.appendChild(script);

return () => {
document.body.removeChild(script);
delete w.FreshworksWidget;
delete w.fwSettings;
};
}, [widgetId]);
};
9 changes: 9 additions & 0 deletions packages/freshdesk/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"extends": "@dans-framework/typescript-config/react-library.json",
"compilerOptions": {
"outDir": "dist",
"rootDir": "src"
},
"include": ["src"],
"exclude": ["node_modules", "dist"]
}
32 changes: 24 additions & 8 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit b63efdb

Please sign in to comment.