From 1ec92489755db5acb37df4a0582a360bea2d8d08 Mon Sep 17 00:00:00 2001
From: Pranshu Chittora <pranshu@signoz.io>
Date: Mon, 12 Sep 2022 16:26:01 +0530
Subject: [PATCH] feat: getting started page (#1560)

Co-authored-by: palashgdev <palashgdev@gmail.com>
---
 frontend/public/Logos/elixir.png              | Bin 0 -> 4523 bytes
 frontend/public/Logos/go.png                  | Bin 0 -> 2968 bytes
 frontend/public/Logos/java.png                | Bin 0 -> 3259 bytes
 frontend/public/Logos/javascript.png          | Bin 0 -> 1682 bytes
 frontend/public/Logos/ms-net-framework.png    | Bin 0 -> 4252 bytes
 frontend/public/Logos/php.png                 | Bin 0 -> 3476 bytes
 frontend/public/Logos/python.png              | Bin 0 -> 2722 bytes
 frontend/public/Logos/rails.png               | Bin 0 -> 1705 bytes
 frontend/public/Logos/rust.png                | Bin 0 -> 2302 bytes
 frontend/src/constants/routes.ts              |   2 +-
 frontend/src/container/SideNav/Slack.tsx      |  14 +-
 frontend/src/container/SideNav/menuItems.ts   |   2 +-
 .../container/TopNav/Breadcrumbs/index.tsx    |   2 +-
 .../src/pages/AddInstrumentation/DocCard.tsx  |  30 +++
 .../src/pages/AddInstrumentation/Section.tsx  |  43 +++++
 .../src/pages/AddInstrumentation/index.tsx    |  42 +----
 .../pages/AddInstrumentation/renderConfig.tsx | 175 ++++++++++++++++++
 .../src/pages/AddInstrumentation/styles.ts    |  12 +-
 .../src/pages/AddInstrumentation/types.ts     |  10 +
 .../src/pages/AddInstrumentation/utmParams.ts |   3 +
 20 files changed, 295 insertions(+), 40 deletions(-)
 create mode 100644 frontend/public/Logos/elixir.png
 create mode 100644 frontend/public/Logos/go.png
 create mode 100644 frontend/public/Logos/java.png
 create mode 100644 frontend/public/Logos/javascript.png
 create mode 100644 frontend/public/Logos/ms-net-framework.png
 create mode 100644 frontend/public/Logos/php.png
 create mode 100644 frontend/public/Logos/python.png
 create mode 100644 frontend/public/Logos/rails.png
 create mode 100644 frontend/public/Logos/rust.png
 create mode 100644 frontend/src/pages/AddInstrumentation/DocCard.tsx
 create mode 100644 frontend/src/pages/AddInstrumentation/Section.tsx
 create mode 100644 frontend/src/pages/AddInstrumentation/renderConfig.tsx
 create mode 100644 frontend/src/pages/AddInstrumentation/types.ts
 create mode 100644 frontend/src/pages/AddInstrumentation/utmParams.ts

diff --git a/frontend/public/Logos/elixir.png b/frontend/public/Logos/elixir.png
new file mode 100644
index 0000000000000000000000000000000000000000..909a736e0f07d0b771dd63c713e3947e8570b7fc
GIT binary patch
literal 4523
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
JPDHLkV1hZ3oKOG&

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/go.png b/frontend/public/Logos/go.png
new file mode 100644
index 0000000000000000000000000000000000000000..70f7bd9728a60137acf5db06995e4d827f39d946
GIT binary patch
literal 2968
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
O0000<MNUMnLSTXnlzFoN

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/java.png b/frontend/public/Logos/java.png
new file mode 100644
index 0000000000000000000000000000000000000000..9e48da3616bb2283a1bdaddff6e0dca43300fa1c
GIT binary patch
literal 3259
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

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/javascript.png b/frontend/public/Logos/javascript.png
new file mode 100644
index 0000000000000000000000000000000000000000..f58be12e19f3143b58ef5524d76c27cc4f5467ed
GIT binary patch
literal 1682
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

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/ms-net-framework.png b/frontend/public/Logos/ms-net-framework.png
new file mode 100644
index 0000000000000000000000000000000000000000..5b0baac0dee1486755120d26aebeeca49ebf648c
GIT binary patch
literal 4252
zcmV;N5M%F&P)<h;3K|Lk000e1NJLTq002M$002M;1^@s6s%dfF00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH5HU$aK~#7F?OJ<~
zmF0Q=z2D`W-DP)KE)hWuxPTxRLAeRIE}{r(Yq8O&F)>ZYnoez-iIcSH*m06+r+>6F
zwBvLdYFdp+EE=7}OUor7RwGc6a0ii#tRNS6S(d$>v*(=e(%<vE-!6;0gtI}%1oqwe
zI3MTx-rIBeJ-_F9kNNt<$6{Q>&A~<9`UQZCy!8tJ7kTR!z`0(CV|!hwtq2Q<^}0}n
zaM8PfckWk={ny}vZ08ifg}U+1)*l6MfwbQ=S`~o-zZ=bT`D)*!P`m}ioWMkgBqT<T
zPNV@cmaij1r7XbJe~k|7@|j73C?|^T;!GT!zUOEz-*IAxSIql3x#wuH9Vs@Phx5v(
zN&4x`v3<rzeBVXHarIu;mh?Avb{P-d*3w;0eQ*I6p~)j~^Ryeg5pZG=yfGmnC*U)F
zB1FM2AoM~V-N=UQRuS>#$g%e!?*rZkd@7%zT*m0;M9fImpX@=lp`$o5FZ;{?xN8-B
zfomE(wi4x6l<>ZwecZ^^&sYUxg>qV%r#IdQ3&_LxX*~ScmoR+%KyK54ABQ?vhMT|f
zo*B6HzFE47TkosItXrn=oj|4UhV(QO=;B>ki-Q8ZNEXTNPJznFv!4}W<mCCCh#*i6
zJFy2pOzRkt?AaI<YQ$$Q{|XfJ{QKu%(fv2!(viavQUHEA-*v3Dh7MQZ25Lp<6oWO0
zz6pT(ftyNU#P~}v=gt|3#0t1bV;rOhm!f9z9E`s93egc(zOWV>*KUCmQfJ&)-s_;2
zLl|zt2~+xxXwjpVyr7)dU>X%&fot@_3V4OI`gFj4Ilm1ZsdjFKW0*8@lw9bYq^1KM
zGe?14b!|0PzPJYa-aLY_<Hq2wKfe_jzXi@9gKKIhW8AE<NR|7vhFINGEhF&(clsqa
zezzzANT(7P)zdCRJ|E&}-A8C|Z4<HJ`h^p)?}IvAHhcu$Ua=VyCtr<$WfeHtbP`T^
zjNkj}0?fVhdX!Z9IM}ckv+lkQCBr?;s=W@s+P4XlYsTY_ugt^P8CT*+{ZV92W#N`b
zSo}w~p?2Z*s6W|+<`Ydwk0{5z58Z*9dDD?k$r_Gf=FM|3<>qP(95xWm`3!3AxfY|w
zT@KGFK~qZ$szy}7q-Zf6G1^bH)9M^`+sIhlD&7T*r{LwrKHh#~2X0(2i(23SB@QM{
z8ISk29E2&P=q4dX&KgRe9Ef~r4&V95Z{WSUJ$UNhp26YW$55FXgxl}91tne?-dM8@
z^B2y=jG8g{(NnKr&GL=-%g4V0Z&Zw19;iV>TO*!a`eS73^Qam!4Bz^P2eACL<yiXf
zuVBjDaaeS3Ew*jnh0KX8wyoHOlY85+Y2B}I^hiCn{ohWc;xr2FbSo;XBbT)nU@W+H
zwxR_PxH+1qC-{f=Ht)lwqlTfZasVdH9)<T097B0WIgP47Tq2OA9E}*G$4<b9t%tCG
zRUJ~tJsdf3R82oiO>KXDH<}MMW8R`0@X`-gBR-r%>-H?R?06UBCRQWUl0)_6E8z}u
z(D-2!rp}#+cQ$Op$?dI(PlQ;zY(2)`I2K_;3pz3dv>eSKSKo$~hBg$Mb2xRV4fO{a
zP`BlM9NJQc<|8c%oQgH7eWz~%aOkfBQWPuPg2DE8cH`>VqcNlQT5Nc2BVwOsM)Y?n
zbvN+&8K7#Ahqjgs1yg}ADpTO(AgYx(m!q|0;L?J!d3vPNfhfu$+Z@1m(|GN<cd&2u
zLHzCGk7Dv|6HpkOK|X6xR;Yv@g~+mhnwTKE6tD~wOap?YPvJWXdTx}WFe2nnac1N6
z(0<<pK+}(85|=U{kZpQ>D;6xSK@0sXbG*ZbMvm<SoJioB=)G@G9j=>p4V+;)w3jr&
z9cYmrARrkZAuZ~?ZF@1T_A2Dk#QjTROqe<bhxZ&uS(S^mZ>+=jpZEzT%=|nK?l_9+
zGbbQZ(S%d!ET-Lb4R&nUV=YcJ>%<y8kSDN~ddQ_ZtWYTMDDJ-LGl^2sOfb^e8lmM#
z2T|KYp)J7n^*gckt=&jb<6#zP`!FLGPBUylt}RA$eT=7;Jcn<8?@uU{6n1Xjh1D<p
zFB*?GQ`;$F26*+!U*L<6+>81DREvzsVdYC}(6ILu7JPXg1v3u$TprIp@hTekH)2i2
z2K>#xJgSjr|MvIsv;X{WTBbo`T{FBqg-YSp6Pzncs_@9S9>OzAmT_Hy3PyNAZ_N~Y
zFe0JLjq=F3F-mCxd1V_J0$&Nzlw&(5DUGwpdMSy%NJru-<qTyRMQj2Cfh330s1&WK
zECv+Hlt8(mgVuBh($rF(iYlQAI|T>rY4QeTdJ)5=n7V`^S`g#DC{#9XB2PI%K-cs0
zG<PqHRE}#aDJWq}=gPQdpU(p&LzW$OT7f!G@fP4kLPt4>M;|625>2?FQg|k%Y|A&o
z;C!Sa8PZiE;|eJW%D6C+8^&$l8Nfb3MS*_GJ|W$TfWa}iJz|GP|B5M;Fin!>$|i+C
zku^GzvOu4f=dy3$iaM+?0$m-2kSfS35v4o@J6Fh(FXM(vnv4*qz|~KoNJ5!K9>u$W
zXuRCu;qQD211dQY8SyfPuEyPr&k%Et)eqgsN;q^qZjj*Pd6+zV92VR+6DNqwKVI@v
zMiZMS2!(y{oA=;zBP+NVs}W(0QG6zK70o^Uy`Q4Bu?<732jYQm{Gl>ENBRgTDM<-n
z^A9V;*qk<OA!MtceG~iMKA>bw7O8l_cl(eHa$st5;@puKFq8ry$lYCfJD&XOA0Z?j
zKzz)#iHqq>X2eJs8i!U_VM1*+>b8HxO~)D~95v@0#?Kjv&s|l?HF?@6cEnvihRs~7
zPZr7@W5D1tOsu(zYnSXGRu|A$g!-CLH{~R3uY3QuR<2h!5-W@7o+?1}!2%qS9Hner
z>pwAFV(P5%n0m_uY<gt}(jk31wm_q}tQi<|Lo%6!2qQ@hebNslBo*i`)|ZJc*sy#n
zHov}0wPQ57N0$-ESZz)1%0o^aY{k;QdPaq9vs0QnEwARbnV53J1agg!@bjmZQ^?j8
z#1bU#?<E(AICo@RwKSuy8uq~gG&M`KLlE5d_6|&)F%kFt*`27{aRkl#Gx|*PIeAY(
z)3GV5?!{>CEcrw1xVrE-_Ea$P?XkTluzkfI?c0N(>LvtOOOUPaz}7Xpt>z=~H=p?e
zEostdou`egaPz92@R?7zqHPfpvsA$om-7|e4$dDFPkc?Tisk{5rFEGmJFb0oJq~R9
z0F{?k;;x4mF$K;mR|u(DS(fDYlKKjP>dgN&VHY3QKcktQWNWeZ2$@|9&!PcK*b+QR
zz)LQzKp30V8EgCszybrl%pvk+zc>ml2*PrH;<koBPlT<O80uU|aH41d$RdrfEF_s>
zE{$jZ`DJ98xXf5M71c8?<7OmuiHW(2+M%(93oUTSRO%Lv3Ph^{ku6pTVhhsesHs2{
z%f-gjSS+Cv5;1&Diz6+LSohL}3(|{rW2dVCVv@N;@G1cv-%|^+eLZ!<P~9u)ivUEU
z$uS8B_4uE|yAI>6pKVl7dFb&6;S9+$mGzTqP7z~vm9b1$g(p%Mu=G}H1t5qz8tguu
zlbJr$1Cr`Y60Jn)=^%}lf3SjC-VqGCyaK=fwVO$N3g~VBad%Wpnt-E(PWjfS#)V;e
z601X+Y9x`Rp!~xNouY**`j53vS6q>_cmc$nbv-B*wW!X&b`LKuT@EJ~W8r-_Vfb}J
zY>X{(Oo2cFs`OwNgGQI3VoV9DMpt3rm`YSId{&Mcg3@7?XT<eSvK1W#jIF{Y=6PD9
zQjpxeZa>zocn39qFdg@Q^9xw=r$2yc>jbV)OH;j$Dc~i^3Qc_ey>l^d@oaL9P|;fp
zp)!8K#q#G?W98CcTEG58o9PP%cot<%rx5b$!*Y3XDSoo#=V<((6<1EW95>uGT}q>t
zps8Qm8gS3~<HTLKjDWDnq%z1vC}i2YgJQ{$QD)h{!}*jTz?|Q?K&-{dh@p#ougS*?
z-(Q8V|NY%q{O|(o-SjSwzS~CMPNNGrddwecL=kqj{J-ABnq}+MVw^Y$X%wyyFcFMV
zRL3XY`cM@{*B;`ouZ&Uy$pg|%j5d;hY<-iZs453vcw{ki{CpDj&Zx+D8&bG{jp=!&
zt=SXI;p-U+nMM~r0&>S$%4%R{*A{j=_&E16yWTCLOP`L$x^KbaL1YP!akS9k)1RMz
z;(yTI5HJB6kLimhvObYf&@jEO#z}-AV-%Dng03ZF356CyWVF(gL-9UvT1&-<%=xwB
zbe_)Wj^oa|uGT4l0?ALn#752zn)c`L@_($+#N}&`ei0>uyAIfUOyMSH14`?K{E+a(
z%q$~g36ms9lFthXI<vp&S|ZT9brsus7eLI~o*ZgKvSn9GN~#@%-6U&sboEm`e&R6&
z%UmoMVEywOv2D|Sln(ar;I|)8nk<P@XV{Yggh$8;k^HxifTSF%6g(R}93?`@CHEA9
z7uiruW{@Oa5l&O=I8hSLp9cgeK?euu@Y<=3oN7oaI<e4F(<yUL*n3ae$wEk6UU=eV
z4&Y$g!il(g))+l9>)cG|!iDJ>n!6_jl}M5u@_`@$*VxwbY|W2UnS~Rz413;Y7cZ6}
zRulQjNu#6rM_*d60!R&s@fS<JitqmLQ4G1VEIFz&iARWEM!KQ1{(6FoZ`#>Rmbgl*
zLDS|;vWKe4U)O800cMtx!@GmhD5)+*>E}s=uK3t>d0MS0G&cX2$f5m{BuWz-3Rem+
z=wcnk38F_B6!V$NqoiwY8bd|qF@JF_o?o&Yo+s6oyv`>vTMtJ~&~xw5f-r=}|6<t&
z%)Wg(&k%+xCMfX{(^WEIEbwWPlE-Zi&cz*HuBC7jD%-6I4PN#1FY)5PuF_(M<Oh1L
zBlF9p$7)6il#?8s>KH{pd@nq};P}B)Xl)><l^7h@bwtnb1Ot3iiiX3@EKTPS<y`ba
z?-L=A$aq{>YXzSEyXW!8kKNDG7|?vYMblDaD|(u=HXJ_1+MPWOmYm(P$DR=0mT5_*
zGYR&%>MDX!JU-R+Hq<rY<gw<&P3_6?xgfIFs<13>(1?L>c*4_osEHLES2K7~T##az
zqOZzntrz)c5r73Gho$ep@W6vrSv@HZ<)k;ITGX*<MM8Z;YO(8g1yTI5A3GR(mPhk;
znS9BKFp`3c4Wl*%mLx1>jnN5RyRPI6uv4jL6GN{|P;&H^qpjM<HTEbvsp+u%oVH7g
z<1Q)pkZM<Y8>oKVf<02xXUT5>baEj<EC6`DfT?{KXNVO^4u5(>3Bl(2Jk~0_(C@wo
zbf;`*YhLdYn<Rw9XCW{snwg#1$Bx<ayJA{=p3i%4XUzpn=PwC9q4wMQbG!auisCbG
z=ac95*0(RF7Jt?PI6oeL_P)gmA?|m9egWVjZ=W#+d>XN_FJqeDhA8k^5(Lxl0{sHO
yMc(?OK(Q}sozZmO|7Ps1X9n39Civ;->i+@x?X5sWmSF7w0000<MNUMnLSTYBY#3Ys

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/php.png b/frontend/public/Logos/php.png
new file mode 100644
index 0000000000000000000000000000000000000000..9abe0a96f6419598f7507e2603479f4d22e256ed
GIT binary patch
literal 3476
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
C>vqKe

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/python.png b/frontend/public/Logos/python.png
new file mode 100644
index 0000000000000000000000000000000000000000..664f75d425fc7027bde93c4b39beb0105b2ef7e0
GIT binary patch
literal 2722
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

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/rails.png b/frontend/public/Logos/rails.png
new file mode 100644
index 0000000000000000000000000000000000000000..0a44785da64d468d8aa136994ae9ea0a364330fe
GIT binary patch
literal 1705
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

literal 0
HcmV?d00001

diff --git a/frontend/public/Logos/rust.png b/frontend/public/Logos/rust.png
new file mode 100644
index 0000000000000000000000000000000000000000..2637dc9314859a4c9cde431860e17369fcab8848
GIT binary patch
literal 2302
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
Y1!w-R)&)lw_W%F@07*qoM6N<$g4dL2UjP6A

literal 0
HcmV?d00001

diff --git a/frontend/src/constants/routes.ts b/frontend/src/constants/routes.ts
index c9fc9fe90a..6fe138d33b 100644
--- a/frontend/src/constants/routes.ts
+++ b/frontend/src/constants/routes.ts
@@ -6,7 +6,7 @@ const ROUTES = {
 	TRACE: '/trace',
 	TRACE_DETAIL: '/trace/:id',
 	SETTINGS: '/settings',
-	INSTRUMENTATION: '/add-instrumentation',
+	INSTRUMENTATION: '/get-started',
 	USAGE_EXPLORER: '/usage-explorer',
 	APPLICATION: '/application',
 	ALL_DASHBOARD: '/dashboard',
diff --git a/frontend/src/container/SideNav/Slack.tsx b/frontend/src/container/SideNav/Slack.tsx
index c0abe5d3ba..f4f1e8e5c6 100644
--- a/frontend/src/container/SideNav/Slack.tsx
+++ b/frontend/src/container/SideNav/Slack.tsx
@@ -1,10 +1,14 @@
 import React from 'react';
 
-function Slack(): JSX.Element {
+interface ISlackProps {
+	width?: number;
+	height?: number;
+}
+function Slack({ width, height }: ISlackProps): JSX.Element {
 	return (
 		<svg
-			width="28"
-			height="28"
+			width={`${width}`}
+			height={`${height}`}
 			viewBox="0 0 28 28"
 			fill="none"
 			xmlns="http://www.w3.org/2000/svg"
@@ -44,5 +48,9 @@ function Slack(): JSX.Element {
 		</svg>
 	);
 }
+Slack.defaultProps = {
+	width: 28,
+	height: 28,
+};
 
 export default Slack;
diff --git a/frontend/src/container/SideNav/menuItems.ts b/frontend/src/container/SideNav/menuItems.ts
index d3e400dedf..f811c333a3 100644
--- a/frontend/src/container/SideNav/menuItems.ts
+++ b/frontend/src/container/SideNav/menuItems.ts
@@ -62,7 +62,7 @@ const menus: SidebarMenu[] = [
 	{
 		Icon: ApiOutlined,
 		to: ROUTES.INSTRUMENTATION,
-		name: 'Add instrumentation',
+		name: 'Get Started',
 	},
 ];
 
diff --git a/frontend/src/container/TopNav/Breadcrumbs/index.tsx b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
index a79e5e3885..85cb0227a1 100644
--- a/frontend/src/container/TopNav/Breadcrumbs/index.tsx
+++ b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
@@ -8,7 +8,7 @@ const breadcrumbNameMap = {
 	[ROUTES.TRACE]: 'Traces',
 	[ROUTES.SERVICE_MAP]: 'Service Map',
 	[ROUTES.USAGE_EXPLORER]: 'Usage Explorer',
-	[ROUTES.INSTRUMENTATION]: 'Add instrumentation',
+	[ROUTES.INSTRUMENTATION]: 'Get Started',
 	[ROUTES.SETTINGS]: 'Settings',
 	[ROUTES.DASHBOARD]: 'Dashboard',
 	[ROUTES.ALL_ERROR]: 'Exceptions',
diff --git a/frontend/src/pages/AddInstrumentation/DocCard.tsx b/frontend/src/pages/AddInstrumentation/DocCard.tsx
new file mode 100644
index 0000000000..38bf63c16d
--- /dev/null
+++ b/frontend/src/pages/AddInstrumentation/DocCard.tsx
@@ -0,0 +1,30 @@
+import { Typography } from 'antd';
+import React from 'react';
+import { useSelector } from 'react-redux';
+import { Link } from 'react-router-dom';
+import { AppState } from 'store/reducers';
+import AppReducer from 'types/reducer/app';
+
+import { DocCardContainer } from './styles';
+import { TGetStartedContentDoc } from './types';
+import UTMParams from './utmParams';
+
+interface IDocCardProps {
+	text: TGetStartedContentDoc['title'];
+	icon: TGetStartedContentDoc['icon'];
+	url: TGetStartedContentDoc['url'];
+}
+function DocCard({ icon, text, url }: IDocCardProps): JSX.Element {
+	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
+
+	return (
+		<Link to={{ pathname: `${url}${UTMParams}` }} target="_blank">
+			<DocCardContainer isDarkMode={isDarkMode}>
+				<span style={{ color: isDarkMode ? '#ddd' : '#333' }}>{icon}</span>
+				<Typography.Text style={{ marginLeft: '0.5rem' }}>{text}</Typography.Text>
+			</DocCardContainer>
+		</Link>
+	);
+}
+
+export default DocCard;
diff --git a/frontend/src/pages/AddInstrumentation/Section.tsx b/frontend/src/pages/AddInstrumentation/Section.tsx
new file mode 100644
index 0000000000..4a90b746de
--- /dev/null
+++ b/frontend/src/pages/AddInstrumentation/Section.tsx
@@ -0,0 +1,43 @@
+import { Col, Row, Typography } from 'antd';
+import { map } from 'lodash-es';
+import React from 'react';
+
+import DocCard from './DocCard';
+import { TGetStartedContentSection } from './types';
+
+interface IDocSectionProps {
+	sectionData: TGetStartedContentSection;
+}
+
+function DocSection({ sectionData }: IDocSectionProps): JSX.Element {
+	return (
+		<div style={{ marginTop: '2rem' }}>
+			<Typography.Text strong>{sectionData.heading}</Typography.Text>
+			<Row
+				gutter={{ xs: 0, sm: 8, md: 16, lg: 24 }}
+				style={{ padding: '0 3%', marginTop: '0.5rem' }}
+			>
+				{sectionData.description && (
+					<Col span={24}>
+						<Typography.Text>{sectionData.description}</Typography.Text>
+					</Col>
+				)}
+				{map(sectionData.items, (item, idx) => (
+					<Col
+						key={`${item.title}+${idx}`}
+						sm={24}
+						md={12}
+						lg={12}
+						xl={8}
+						xxl={6}
+						style={{ margin: '1rem 0' }}
+					>
+						<DocCard icon={item.icon} text={item.title} url={item.url} />
+					</Col>
+				))}
+			</Row>
+		</div>
+	);
+}
+
+export default DocSection;
diff --git a/frontend/src/pages/AddInstrumentation/index.tsx b/frontend/src/pages/AddInstrumentation/index.tsx
index f4adc07b2c..5703239b51 100644
--- a/frontend/src/pages/AddInstrumentation/index.tsx
+++ b/frontend/src/pages/AddInstrumentation/index.tsx
@@ -1,43 +1,19 @@
 import { Typography } from 'antd';
 import React from 'react';
-import { useSelector } from 'react-redux';
-import { AppState } from 'store/reducers';
-import AppReducer from 'types/reducer/app';
 
-import { Container, Heading } from './styles';
+import { GetStartedContent } from './renderConfig';
+import DocSection from './Section';
 
 function InstrumentationPage(): JSX.Element {
-	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
-
 	return (
 		<>
-			<Heading>Instrument your application</Heading>
-			<Container isDarkMode={isDarkMode}>
-				<Typography>Congrats, you have successfully installed SigNoz!</Typography>{' '}
-				<Typography>
-					To start seeing YOUR application data here, follow the instructions in the
-					docs -
-				</Typography>
-				<a
-					href="https://signoz.io/docs/instrumentation/overview"
-					target="_blank"
-					rel="noreferrer"
-				>
-					https://signoz.io/docs/instrumentation/overview
-				</a>
-				&nbsp;If you face any issues, join our
-				<a
-					href="https://signoz-community.slack.com/join/shared_invite/zt-lrjknbbp-J_mI13rlw8pGF4EWBnorJA"
-					target="_blank"
-					rel="noreferrer"
-				>
-					&nbsp;slack community&nbsp;
-				</a>
-				to ask any questions or mail us at&nbsp;
-				<a href="mailto:support@signoz.io" target="_blank" rel="noreferrer">
-					support@signoz.io
-				</a>
-			</Container>
+			<Typography>
+				Congrats, you have successfully installed SigNoz! Now lets get some data in
+				and start deriving insights from them
+			</Typography>
+			{GetStartedContent().map((section) => {
+				return <DocSection key={section.heading} sectionData={section} />;
+			})}
 		</>
 	);
 }
diff --git a/frontend/src/pages/AddInstrumentation/renderConfig.tsx b/frontend/src/pages/AddInstrumentation/renderConfig.tsx
new file mode 100644
index 0000000000..86aa6b5ed7
--- /dev/null
+++ b/frontend/src/pages/AddInstrumentation/renderConfig.tsx
@@ -0,0 +1,175 @@
+import {
+	AlertFilled,
+	AlignLeftOutlined,
+	ApiFilled,
+	BarChartOutlined,
+	DashboardFilled,
+	SoundFilled,
+} from '@ant-design/icons';
+import { Typography } from 'antd';
+import Slack from 'container/SideNav/Slack';
+import React from 'react';
+import store from 'store';
+
+import { TGetStartedContentSection } from './types';
+
+export const GetStartedContent = (): TGetStartedContentSection[] => {
+	const {
+		app: { currentVersion },
+	} = store.getState();
+	return [
+		{
+			heading: 'Send data from your applications to SigNoz',
+			items: [
+				{
+					title: 'Instrument your Java Application',
+					icon: (
+						<img src={`/Logos/java.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/java/',
+				},
+				{
+					title: 'Instrument your Python Application',
+					icon: (
+						<img src={`/Logos/python.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/python/',
+				},
+				{
+					title: 'Instrument your JS Application',
+					icon: (
+						<img
+							src={`/Logos/javascript.png?currentVersion=${currentVersion}`}
+							alt=""
+						/>
+					),
+					url: 'https://signoz.io/docs/instrumentation/javascript/',
+				},
+				{
+					title: 'Instrument your Go Application',
+					icon: (
+						<img src={`/Logos/go.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/golang/',
+				},
+				{
+					title: 'Instrument your .NET Application',
+					icon: (
+						<img
+							src={`/Logos/ms-net-framework.png?currentVersion=${currentVersion}`}
+							alt=""
+						/>
+					),
+					url: 'https://signoz.io/docs/instrumentation/dotnet/',
+				},
+				{
+					title: 'Instrument your PHP Application',
+					icon: (
+						<img src={`/Logos/php.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/php/',
+				},
+				{
+					title: 'Instrument your Rails Application',
+					icon: (
+						<img src={`/Logos/rails.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/ruby-on-rails/',
+				},
+				{
+					title: 'Instrument your Rust Application',
+					icon: (
+						<img src={`/Logos/rust.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/rust/',
+				},
+				{
+					title: 'Instrument your Elixir Application',
+					icon: (
+						<img src={`/Logos/elixir.png?currentVersion=${currentVersion}`} alt="" />
+					),
+					url: 'https://signoz.io/docs/instrumentation/elixir/',
+				},
+			],
+		},
+		{
+			heading: 'Send Metrics from your Infrastructure & create Dashboards',
+			items: [
+				{
+					title: 'Send metrics to SigNoz',
+					icon: <BarChartOutlined style={{ fontSize: '3.5rem' }} />,
+					url: 'https://signoz.io/docs/userguide/send-metrics/',
+				},
+				{
+					title: 'Create and Manage Dashboards',
+					icon: <DashboardFilled style={{ fontSize: '3.5rem' }} />,
+					url: 'https://signoz.io/docs/userguide/manage-dashboards-and-panels/',
+				},
+			],
+		},
+		{
+			heading: 'Send your logs to SigNoz',
+			items: [
+				{
+					title: 'Send your logs to SigNoz',
+					icon: <AlignLeftOutlined style={{ fontSize: '3.5rem' }} />,
+					url: 'https://signoz.io/docs/userguide/logs/',
+				},
+				{
+					title: 'Existing log collectors to SigNoz',
+					icon: <ApiFilled style={{ fontSize: '3.5rem' }} />,
+					url: 'https://signoz.io/docs/userguide/fluentbit_to_signoz/',
+				},
+			],
+		},
+		{
+			heading: 'Create alerts on Metrics',
+			items: [
+				{
+					title: 'Create alert rules on metrics',
+					icon: <AlertFilled style={{ fontSize: '3.5rem' }} />,
+					url: 'https://signoz.io/docs/userguide/alerts-management/',
+				},
+				{
+					title: 'Configure alert notification channels',
+					icon: <SoundFilled style={{ fontSize: '3.5rem' }} />,
+					url:
+						'https://signoz.io/docs/userguide/alerts-management/#setting-up-a-notification-channel',
+				},
+			],
+		},
+		{
+			heading: 'Need help?',
+			description: (
+				<>
+					{'Join our slack community and ask any question you may have on '}
+					<Typography.Link
+						href="https://signoz-community.slack.com/archives/C01HWUTP4HH"
+						target="_blank"
+					>
+						#support
+					</Typography.Link>
+					{' or '}
+					<Typography.Link
+						href="https://signoz-community.slack.com/archives/C01HWQ1R0BC"
+						target="_blank"
+					>
+						#general
+					</Typography.Link>
+				</>
+			),
+
+			items: [
+				{
+					title: 'Join SigNoz slack community ',
+					icon: (
+						<div style={{ padding: '0.7rem' }}>
+							<Slack width={30} height={30} />
+						</div>
+					),
+					url: 'https://signoz.io/slack',
+				},
+			],
+		},
+	];
+};
diff --git a/frontend/src/pages/AddInstrumentation/styles.ts b/frontend/src/pages/AddInstrumentation/styles.ts
index af4a0bfb29..6e1ec7ad44 100644
--- a/frontend/src/pages/AddInstrumentation/styles.ts
+++ b/frontend/src/pages/AddInstrumentation/styles.ts
@@ -1,4 +1,4 @@
-import { Card, Typography } from 'antd';
+import { Card, Row, Typography } from 'antd';
 import styled from 'styled-components';
 
 interface Props {
@@ -18,3 +18,13 @@ export const Heading = styled(Typography)`
 		margin-bottom: 1rem;
 	}
 `;
+
+export const DocCardContainer = styled(Row)<{
+	isDarkMode: boolean;
+}>`
+	display: flex;
+	border: 1px solid ${({ isDarkMode }): string => (isDarkMode ? '#444' : '#ccc')};
+	border-radius: 0.2rem;
+	align-items: center;
+	padding: 0.5rem 0.25rem;
+`;
diff --git a/frontend/src/pages/AddInstrumentation/types.ts b/frontend/src/pages/AddInstrumentation/types.ts
new file mode 100644
index 0000000000..b544254038
--- /dev/null
+++ b/frontend/src/pages/AddInstrumentation/types.ts
@@ -0,0 +1,10 @@
+export type TGetStartedContentDoc = {
+	title: string;
+	icon: JSX.Element;
+	url: string;
+};
+export type TGetStartedContentSection = {
+	heading: string;
+	description?: string | JSX.Element;
+	items: TGetStartedContentDoc[];
+};
diff --git a/frontend/src/pages/AddInstrumentation/utmParams.ts b/frontend/src/pages/AddInstrumentation/utmParams.ts
new file mode 100644
index 0000000000..1aa01f503b
--- /dev/null
+++ b/frontend/src/pages/AddInstrumentation/utmParams.ts
@@ -0,0 +1,3 @@
+const UTMParams =
+	'?utm_source=instrumentation_page&utm_medium=frontend&utm_term=language';
+export default UTMParams;