@eric-emg/symphiq-components 1.2.165 → 1.2.166
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/symphiq-components.mjs +385 -386
- package/fesm2022/symphiq-components.mjs.map +1 -1
- package/index.d.ts +29 -27
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/styles.css +4 -0
- package/styles.css +56 -0
|
@@ -54345,86 +54345,79 @@ class SymphiqConnectGaDashboardComponent {
|
|
|
54345
54345
|
i0.ɵɵlistener("scroll", function SymphiqConnectGaDashboardComponent_scroll_HostBindingHandler($event) { return ctx.onScroll($event); }, i0.ɵɵresolveWindow);
|
|
54346
54346
|
} if (rf & 2) {
|
|
54347
54347
|
i0.ɵɵclassProp("light", ctx.isLightMode())("dark", !ctx.isLightMode());
|
|
54348
|
-
} }, inputs: { embedded: [1, "embedded"], parentHeaderOffset: [1, "parentHeaderOffset"], viewMode: [1, "viewMode"], scrollEvent: [1, "scrollEvent"], scrollElement: [1, "scrollElement"], forDemo: [1, "forDemo"], maxAccessibleStepId: [1, "maxAccessibleStepId"] }, outputs: { stepClick: "stepClick", nextStepClick: "nextStepClick", googleButtonClick: "googleButtonClick" }, decls:
|
|
54349
|
-
i0.ɵɵelementStart(0, "div", 0)
|
|
54350
|
-
i0.ɵɵelement(
|
|
54351
|
-
i0.ɵɵ
|
|
54352
|
-
i0.ɵɵ
|
|
54353
|
-
i0.ɵɵelementStart(4, "div", 3)(5, "header", 4)(6, "div", 5)(7, "div", 6)(8, "div", 7)(9, "div")(10, "h1", 0);
|
|
54354
|
-
i0.ɵɵtext(11, " Connect Google Analytics 4 ");
|
|
54348
|
+
} }, inputs: { embedded: [1, "embedded"], parentHeaderOffset: [1, "parentHeaderOffset"], viewMode: [1, "viewMode"], scrollEvent: [1, "scrollEvent"], scrollElement: [1, "scrollElement"], forDemo: [1, "forDemo"], maxAccessibleStepId: [1, "maxAccessibleStepId"] }, outputs: { stepClick: "stepClick", nextStepClick: "nextStepClick", googleButtonClick: "googleButtonClick" }, decls: 68, vars: 61, consts: [[3, "ngClass"], [1, "animated-bubbles", 2, "position", "fixed", "top", "0", "left", "0", "right", "0", "bottom", "0", "width", "100vw", "height", "100vh", "z-index", "1", "pointer-events", "none"], [1, "relative", "z-[51]"], [1, "sticky", "top-0", "z-50", 3, "ngClass"], [1, "transition-all", "duration-300", "ease-in-out", "overflow-hidden"], [1, "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-8"], [1, "flex", "items-center", "justify-between"], [1, "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-3"], [1, "flex-1", "min-w-0", "mr-4"], [3, "stepClick", "nextStepClick", "viewMode", "currentStepId", "showNextStepAction", "forDemo", "maxAccessibleStepId"], [1, "relative"], [1, "max-w-3xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-8"], [1, "rounded-2xl", "border", "shadow-lg", "overflow-hidden", "mb-8", 3, "ngClass"], [1, "px-8", "py-8", 3, "ngClass"], [1, "flex", "items-start", "gap-6"], [1, "flex-shrink-0", "w-16", "h-16", "rounded-2xl", "flex", "items-center", "justify-center", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-8", "h-8"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"], [1, "flex-1"], [1, "text-2xl", "sm:text-3xl", "font-bold", "mb-4", 3, "ngClass"], [1, "text-base", "leading-relaxed", "mb-6", 3, "ngClass"], [1, "mb-6"], ["type", "button", 1, "gsi-material-button", 3, "click"], [1, "gsi-material-button-state"], [1, "gsi-material-button-content-wrapper"], [1, "gsi-material-button-icon"], ["version", "1.1", "xmlns", "http://www.w3.org/2000/svg", "viewBox", "0 0 48 48", 0, "xmlns", "xlink", "http://www.w3.org/1999/xlink", 2, "display", "block"], ["fill", "#EA4335", "d", "M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"], ["fill", "#4285F4", "d", "M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"], ["fill", "#FBBC05", "d", "M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"], ["fill", "#34A853", "d", "M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"], ["fill", "none", "d", "M0 0h48v48H0z"], [1, "gsi-material-button-contents"], [1, "p-4", "rounded-lg", "border", "flex", "items-start", "gap-3", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "mt-0.5", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "text-sm", "leading-relaxed", 3, "ngClass"], [1, "font-semibold"], [1, "mt-6", "rounded-lg", "border", "overflow-hidden", 3, "ngClass"], [1, "px-4", "py-4", "cursor-pointer", "flex", "items-center", "justify-between", "gap-3", "transition-colors", "duration-200", 3, "click", "ngClass"], [1, "text-base", "font-semibold", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "transition-transform", "duration-300", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], [1, "px-4", "pb-4", "pt-2", 3, "ngClass"], [1, "text-sm", "leading-relaxed", "mb-4", 3, "ngClass"], [1, "font-bold"]], template: function SymphiqConnectGaDashboardComponent_Template(rf, ctx) { if (rf & 1) {
|
|
54349
|
+
i0.ɵɵelementStart(0, "div", 0);
|
|
54350
|
+
i0.ɵɵelement(1, "div", 1);
|
|
54351
|
+
i0.ɵɵelementStart(2, "div", 2)(3, "header", 3)(4, "div", 4)(5, "div", 5)(6, "div", 6)(7, "div")(8, "h1", 0);
|
|
54352
|
+
i0.ɵɵtext(9, " Connect Google Analytics 4 ");
|
|
54355
54353
|
i0.ɵɵelementEnd();
|
|
54356
|
-
i0.ɵɵelementStart(
|
|
54357
|
-
i0.ɵɵtext(
|
|
54354
|
+
i0.ɵɵelementStart(10, "p", 0);
|
|
54355
|
+
i0.ɵɵtext(11, " Link your analytics data ");
|
|
54358
54356
|
i0.ɵɵelementEnd()()()()();
|
|
54359
|
-
i0.ɵɵelementStart(
|
|
54360
|
-
i0.ɵɵtext(
|
|
54357
|
+
i0.ɵɵelementStart(12, "div", 4)(13, "div", 7)(14, "div", 6)(15, "div", 8)(16, "h1", 0);
|
|
54358
|
+
i0.ɵɵtext(17, " Connect Google Analytics 4 ");
|
|
54361
54359
|
i0.ɵɵelementEnd()()()()()();
|
|
54362
|
-
i0.ɵɵelementStart(
|
|
54363
|
-
i0.ɵɵlistener("stepClick", function
|
|
54360
|
+
i0.ɵɵelementStart(18, "symphiq-journey-progress-indicator", 9);
|
|
54361
|
+
i0.ɵɵlistener("stepClick", function SymphiqConnectGaDashboardComponent_Template_symphiq_journey_progress_indicator_stepClick_18_listener($event) { return ctx.stepClick.emit($event); })("nextStepClick", function SymphiqConnectGaDashboardComponent_Template_symphiq_journey_progress_indicator_nextStepClick_18_listener() { return ctx.nextStepClick.emit(); });
|
|
54364
54362
|
i0.ɵɵelementEnd();
|
|
54365
|
-
i0.ɵɵelementStart(
|
|
54363
|
+
i0.ɵɵelementStart(19, "main", 10)(20, "div", 11)(21, "div", 12)(22, "div", 13)(23, "div", 14)(24, "div", 15);
|
|
54366
54364
|
i0.ɵɵnamespaceSVG();
|
|
54367
|
-
i0.ɵɵelementStart(
|
|
54368
|
-
i0.ɵɵelement(
|
|
54365
|
+
i0.ɵɵelementStart(25, "svg", 16);
|
|
54366
|
+
i0.ɵɵelement(26, "path", 17);
|
|
54369
54367
|
i0.ɵɵelementEnd()();
|
|
54370
54368
|
i0.ɵɵnamespaceHTML();
|
|
54371
|
-
i0.ɵɵelementStart(
|
|
54372
|
-
i0.ɵɵtext(
|
|
54369
|
+
i0.ɵɵelementStart(27, "div", 18)(28, "h2", 19);
|
|
54370
|
+
i0.ɵɵtext(29, " Connect Google Analytics 4 ");
|
|
54373
54371
|
i0.ɵɵelementEnd();
|
|
54374
|
-
i0.ɵɵelementStart(
|
|
54375
|
-
i0.ɵɵtext(
|
|
54372
|
+
i0.ɵɵelementStart(30, "p", 20);
|
|
54373
|
+
i0.ɵɵtext(31, " Integrating Google Analytics is essential. We use it to pull the majority of your data in a read-only format, ensuring no changes are made to your analytics. Please make sure you have access to the Google Analytics property associated with this shop to ensure proper integration. ");
|
|
54376
54374
|
i0.ɵɵelementEnd();
|
|
54377
|
-
i0.ɵɵelementStart(
|
|
54378
|
-
i0.ɵɵlistener("click", function
|
|
54379
|
-
i0.ɵɵelement(
|
|
54380
|
-
i0.ɵɵelementStart(
|
|
54375
|
+
i0.ɵɵelementStart(32, "div", 21)(33, "button", 22);
|
|
54376
|
+
i0.ɵɵlistener("click", function SymphiqConnectGaDashboardComponent_Template_button_click_33_listener() { return ctx.googleButtonClick.emit(); });
|
|
54377
|
+
i0.ɵɵelement(34, "div", 23);
|
|
54378
|
+
i0.ɵɵelementStart(35, "div", 24)(36, "div", 25);
|
|
54381
54379
|
i0.ɵɵnamespaceSVG();
|
|
54382
|
-
i0.ɵɵelementStart(
|
|
54383
|
-
i0.ɵɵelement(
|
|
54380
|
+
i0.ɵɵelementStart(37, "svg", 26);
|
|
54381
|
+
i0.ɵɵelement(38, "path", 27)(39, "path", 28)(40, "path", 29)(41, "path", 30)(42, "path", 31);
|
|
54384
54382
|
i0.ɵɵelementEnd()();
|
|
54385
54383
|
i0.ɵɵnamespaceHTML();
|
|
54386
|
-
i0.ɵɵelementStart(
|
|
54387
|
-
i0.ɵɵtext(
|
|
54384
|
+
i0.ɵɵelementStart(43, "span", 32);
|
|
54385
|
+
i0.ɵɵtext(44, "Continue with Google");
|
|
54388
54386
|
i0.ɵɵelementEnd()()()();
|
|
54389
|
-
i0.ɵɵelementStart(
|
|
54387
|
+
i0.ɵɵelementStart(45, "div", 33);
|
|
54390
54388
|
i0.ɵɵnamespaceSVG();
|
|
54391
|
-
i0.ɵɵelementStart(
|
|
54392
|
-
i0.ɵɵelement(
|
|
54389
|
+
i0.ɵɵelementStart(46, "svg", 34);
|
|
54390
|
+
i0.ɵɵelement(47, "path", 35);
|
|
54393
54391
|
i0.ɵɵelementEnd();
|
|
54394
54392
|
i0.ɵɵnamespaceHTML();
|
|
54395
|
-
i0.ɵɵelementStart(
|
|
54396
|
-
i0.ɵɵtext(
|
|
54393
|
+
i0.ɵɵelementStart(48, "div", 18)(49, "p", 36)(50, "strong", 37);
|
|
54394
|
+
i0.ɵɵtext(51, "Note:");
|
|
54397
54395
|
i0.ɵɵelementEnd();
|
|
54398
|
-
i0.ɵɵtext(
|
|
54396
|
+
i0.ɵɵtext(52, " When you click \"Continue with Google\", you'll be asked to sign in to your Google account and select the Analytics property associated with your shop. ");
|
|
54399
54397
|
i0.ɵɵelementEnd()()();
|
|
54400
|
-
i0.ɵɵelementStart(
|
|
54401
|
-
i0.ɵɵlistener("click", function
|
|
54402
|
-
i0.ɵɵelementStart(
|
|
54403
|
-
i0.ɵɵtext(
|
|
54398
|
+
i0.ɵɵelementStart(53, "div", 38)(54, "div", 39);
|
|
54399
|
+
i0.ɵɵlistener("click", function SymphiqConnectGaDashboardComponent_Template_div_click_54_listener() { return ctx.toggleExpanded(); });
|
|
54400
|
+
i0.ɵɵelementStart(55, "span", 40);
|
|
54401
|
+
i0.ɵɵtext(56, " How do we use your Google Analytics data? ");
|
|
54404
54402
|
i0.ɵɵelementEnd();
|
|
54405
54403
|
i0.ɵɵnamespaceSVG();
|
|
54406
|
-
i0.ɵɵelementStart(
|
|
54407
|
-
i0.ɵɵelement(
|
|
54404
|
+
i0.ɵɵelementStart(57, "svg", 41);
|
|
54405
|
+
i0.ɵɵelement(58, "path", 42);
|
|
54408
54406
|
i0.ɵɵelementEnd()();
|
|
54409
54407
|
i0.ɵɵnamespaceHTML();
|
|
54410
|
-
i0.ɵɵelementStart(
|
|
54411
|
-
i0.ɵɵtext(
|
|
54408
|
+
i0.ɵɵelementStart(59, "div", 4)(60, "div", 43)(61, "p", 44);
|
|
54409
|
+
i0.ɵɵtext(62, " We request access to your Google Analytics data to aggregate this information into funnel stages and display trends within our application. This allows us to provide you with a clear overview of your web performance. By analyzing the data, we can map out recommendations, measure the impact of your current strategies, and suggest actionable next steps for improvement. ");
|
|
54412
54410
|
i0.ɵɵelementEnd();
|
|
54413
|
-
i0.ɵɵelementStart(
|
|
54414
|
-
i0.ɵɵtext(
|
|
54415
|
-
i0.ɵɵelementStart(
|
|
54416
|
-
i0.ɵɵtext(
|
|
54411
|
+
i0.ɵɵelementStart(63, "p", 36);
|
|
54412
|
+
i0.ɵɵtext(64, " Symphiq's use and transfer to any other app of information received from Google APIs will adhere to ");
|
|
54413
|
+
i0.ɵɵelementStart(65, "strong", 45);
|
|
54414
|
+
i0.ɵɵtext(66, "Google API Services User Data Policy");
|
|
54417
54415
|
i0.ɵɵelementEnd();
|
|
54418
|
-
i0.ɵɵtext(
|
|
54416
|
+
i0.ɵɵtext(67, " including the Limited Use requirements. ");
|
|
54419
54417
|
i0.ɵɵelementEnd()()()()()()()()()()()();
|
|
54420
54418
|
} if (rf & 2) {
|
|
54421
54419
|
i0.ɵɵproperty("ngClass", ctx.getContainerClasses());
|
|
54422
54420
|
i0.ɵɵadvance();
|
|
54423
|
-
i0.ɵɵclassMap(ctx.embedded() ? "sticky top-0 left-0 right-0 h-1 z-[60] bg-slate-200/30" : "fixed top-0 left-0 right-0 h-1 z-[60] bg-slate-200/30");
|
|
54424
|
-
i0.ɵɵadvance();
|
|
54425
|
-
i0.ɵɵstyleProp("width", ctx.scrollProgress(), "%");
|
|
54426
|
-
i0.ɵɵproperty("ngClass", ctx.isLightMode() ? "bg-gradient-to-r from-blue-500 to-cyan-500" : "bg-gradient-to-r from-blue-400 to-cyan-400");
|
|
54427
|
-
i0.ɵɵadvance();
|
|
54428
54421
|
i0.ɵɵclassProp("light-mode", ctx.isLightMode());
|
|
54429
54422
|
i0.ɵɵadvance(2);
|
|
54430
54423
|
i0.ɵɵproperty("ngClass", ctx.getHeaderClasses());
|
|
@@ -54484,184 +54477,175 @@ class SymphiqConnectGaDashboardComponent {
|
|
|
54484
54477
|
args: [{ selector: 'symphiq-connect-ga-dashboard', standalone: true, imports: [CommonModule, JourneyProgressIndicatorComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
54485
54478
|
'[class.light]': 'isLightMode()',
|
|
54486
54479
|
'[class.dark]': '!isLightMode()'
|
|
54487
|
-
}, template: `
|
|
54488
|
-
<div [ngClass]="getContainerClasses()">
|
|
54489
|
-
|
|
54490
|
-
|
|
54491
|
-
|
|
54492
|
-
|
|
54493
|
-
|
|
54494
|
-
|
|
54495
|
-
|
|
54496
|
-
|
|
54497
|
-
|
|
54498
|
-
|
|
54499
|
-
|
|
54500
|
-
|
|
54501
|
-
|
|
54502
|
-
|
|
54503
|
-
|
|
54504
|
-
|
|
54505
|
-
|
|
54506
|
-
|
|
54507
|
-
|
|
54508
|
-
|
|
54509
|
-
|
|
54510
|
-
|
|
54511
|
-
|
|
54512
|
-
|
|
54513
|
-
|
|
54514
|
-
|
|
54515
|
-
|
|
54516
|
-
|
|
54517
|
-
|
|
54518
|
-
|
|
54519
|
-
|
|
54520
|
-
|
|
54521
|
-
|
|
54522
|
-
|
|
54523
|
-
|
|
54524
|
-
|
|
54525
|
-
|
|
54526
|
-
|
|
54527
|
-
|
|
54528
|
-
|
|
54529
|
-
|
|
54530
|
-
|
|
54531
|
-
|
|
54532
|
-
|
|
54533
|
-
|
|
54534
|
-
|
|
54535
|
-
|
|
54536
|
-
|
|
54537
|
-
|
|
54538
|
-
|
|
54539
|
-
|
|
54540
|
-
|
|
54541
|
-
|
|
54542
|
-
|
|
54543
|
-
|
|
54544
|
-
|
|
54545
|
-
|
|
54546
|
-
|
|
54547
|
-
|
|
54548
|
-
|
|
54549
|
-
|
|
54550
|
-
|
|
54551
|
-
|
|
54552
|
-
|
|
54553
|
-
|
|
54554
|
-
|
|
54555
|
-
|
|
54556
|
-
|
|
54557
|
-
|
|
54558
|
-
|
|
54559
|
-
|
|
54560
|
-
|
|
54561
|
-
|
|
54562
|
-
|
|
54563
|
-
|
|
54564
|
-
|
|
54565
|
-
|
|
54566
|
-
|
|
54567
|
-
|
|
54568
|
-
|
|
54569
|
-
|
|
54570
|
-
|
|
54571
|
-
|
|
54572
|
-
|
|
54573
|
-
|
|
54574
|
-
|
|
54575
|
-
|
|
54576
|
-
|
|
54577
|
-
|
|
54578
|
-
|
|
54579
|
-
|
|
54580
|
-
|
|
54581
|
-
|
|
54582
|
-
|
|
54583
|
-
|
|
54584
|
-
|
|
54585
|
-
|
|
54586
|
-
|
|
54587
|
-
<
|
|
54588
|
-
|
|
54589
|
-
|
|
54590
|
-
|
|
54591
|
-
|
|
54592
|
-
|
|
54593
|
-
|
|
54594
|
-
|
|
54595
|
-
|
|
54596
|
-
|
|
54597
|
-
|
|
54598
|
-
|
|
54599
|
-
|
|
54600
|
-
|
|
54601
|
-
|
|
54602
|
-
|
|
54603
|
-
|
|
54604
|
-
|
|
54605
|
-
|
|
54606
|
-
|
|
54607
|
-
|
|
54608
|
-
|
|
54609
|
-
|
|
54610
|
-
|
|
54611
|
-
|
|
54612
|
-
|
|
54613
|
-
|
|
54614
|
-
|
|
54615
|
-
|
|
54616
|
-
|
|
54617
|
-
|
|
54618
|
-
|
|
54619
|
-
|
|
54620
|
-
|
|
54621
|
-
|
|
54622
|
-
</
|
|
54623
|
-
|
|
54624
|
-
|
|
54625
|
-
|
|
54626
|
-
|
|
54627
|
-
|
|
54628
|
-
|
|
54629
|
-
|
|
54630
|
-
|
|
54631
|
-
|
|
54632
|
-
|
|
54633
|
-
|
|
54634
|
-
|
|
54635
|
-
|
|
54636
|
-
|
|
54637
|
-
|
|
54638
|
-
|
|
54639
|
-
|
|
54640
|
-
|
|
54641
|
-
|
|
54642
|
-
|
|
54643
|
-
|
|
54644
|
-
|
|
54645
|
-
|
|
54646
|
-
|
|
54647
|
-
|
|
54648
|
-
|
|
54649
|
-
|
|
54650
|
-
</div>
|
|
54651
|
-
</div>
|
|
54652
|
-
</div>
|
|
54653
|
-
</div>
|
|
54654
|
-
</div>
|
|
54655
|
-
</div>
|
|
54656
|
-
</main>
|
|
54657
|
-
</div>
|
|
54658
|
-
</div>
|
|
54480
|
+
}, template: `
|
|
54481
|
+
<div [ngClass]="getContainerClasses()">
|
|
54482
|
+
<div class="animated-bubbles" [class.light-mode]="isLightMode()" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100vw; height: 100vh; z-index: 1; pointer-events: none;"></div>
|
|
54483
|
+
|
|
54484
|
+
<div class="relative z-[51]">
|
|
54485
|
+
<header [ngClass]="getHeaderClasses()" class="sticky top-0 z-50">
|
|
54486
|
+
<!-- Expanded Header -->
|
|
54487
|
+
<div
|
|
54488
|
+
class="transition-all duration-300 ease-in-out overflow-hidden"
|
|
54489
|
+
[class.max-h-0]="headerScrollService.isScrolled()"
|
|
54490
|
+
[class.opacity-0]="headerScrollService.isScrolled()"
|
|
54491
|
+
[class.max-h-96]="!headerScrollService.isScrolled()"
|
|
54492
|
+
[class.opacity-100]="!headerScrollService.isScrolled()">
|
|
54493
|
+
<div
|
|
54494
|
+
class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8"
|
|
54495
|
+
[class.pointer-events-none]="headerScrollService.isScrolled()"
|
|
54496
|
+
[class.pointer-events-auto]="!headerScrollService.isScrolled()">
|
|
54497
|
+
<div class="flex items-center justify-between">
|
|
54498
|
+
<div>
|
|
54499
|
+
<h1 [ngClass]="getMainTitleClasses()">
|
|
54500
|
+
Connect Google Analytics 4
|
|
54501
|
+
</h1>
|
|
54502
|
+
<p [ngClass]="getSubtitleClasses()">
|
|
54503
|
+
Link your analytics data
|
|
54504
|
+
</p>
|
|
54505
|
+
</div>
|
|
54506
|
+
</div>
|
|
54507
|
+
</div>
|
|
54508
|
+
</div>
|
|
54509
|
+
|
|
54510
|
+
<!-- Condensed Header -->
|
|
54511
|
+
<div
|
|
54512
|
+
class="transition-all duration-300 ease-in-out overflow-hidden"
|
|
54513
|
+
[class.max-h-0]="!headerScrollService.isScrolled()"
|
|
54514
|
+
[class.opacity-0]="!headerScrollService.isScrolled()"
|
|
54515
|
+
[class.max-h-20]="headerScrollService.isScrolled()"
|
|
54516
|
+
[class.opacity-100]="headerScrollService.isScrolled()">
|
|
54517
|
+
<div
|
|
54518
|
+
class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-3"
|
|
54519
|
+
[class.pointer-events-none]="!headerScrollService.isScrolled()"
|
|
54520
|
+
[class.pointer-events-auto]="headerScrollService.isScrolled()">
|
|
54521
|
+
<div class="flex items-center justify-between">
|
|
54522
|
+
<div class="flex-1 min-w-0 mr-4">
|
|
54523
|
+
<h1 [ngClass]="isLightMode() ? 'text-xl font-bold bg-gradient-to-r from-blue-600 to-cyan-600 bg-clip-text text-transparent truncate' : 'text-xl font-bold bg-gradient-to-r from-blue-400 to-cyan-400 bg-clip-text text-transparent truncate'">
|
|
54524
|
+
Connect Google Analytics 4
|
|
54525
|
+
</h1>
|
|
54526
|
+
</div>
|
|
54527
|
+
</div>
|
|
54528
|
+
</div>
|
|
54529
|
+
</div>
|
|
54530
|
+
</header>
|
|
54531
|
+
|
|
54532
|
+
<!-- Journey Progress Indicator -->
|
|
54533
|
+
<symphiq-journey-progress-indicator
|
|
54534
|
+
[viewMode]="viewMode()"
|
|
54535
|
+
[currentStepId]="JourneyStepIdEnum.CONNECT_GA4"
|
|
54536
|
+
[showNextStepAction]="true"
|
|
54537
|
+
[forDemo]="forDemo()"
|
|
54538
|
+
[maxAccessibleStepId]="maxAccessibleStepId()"
|
|
54539
|
+
(stepClick)="stepClick.emit($event)"
|
|
54540
|
+
(nextStepClick)="nextStepClick.emit()"
|
|
54541
|
+
/>
|
|
54542
|
+
|
|
54543
|
+
<main class="relative">
|
|
54544
|
+
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
54545
|
+
<!-- Main Content Card -->
|
|
54546
|
+
<div [ngClass]="containerClasses()" class="rounded-2xl border shadow-lg overflow-hidden mb-8">
|
|
54547
|
+
<div [ngClass]="contentClasses()" class="px-8 py-8">
|
|
54548
|
+
<div class="flex items-start gap-6">
|
|
54549
|
+
<!-- Icon Container -->
|
|
54550
|
+
<div [ngClass]="iconContainerClasses()" class="flex-shrink-0 w-16 h-16 rounded-2xl flex items-center justify-center">
|
|
54551
|
+
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
54552
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
|
|
54553
|
+
</svg>
|
|
54554
|
+
</div>
|
|
54555
|
+
|
|
54556
|
+
<div class="flex-1">
|
|
54557
|
+
<h2 [ngClass]="titleClasses()" class="text-2xl sm:text-3xl font-bold mb-4">
|
|
54558
|
+
Connect Google Analytics 4
|
|
54559
|
+
</h2>
|
|
54560
|
+
|
|
54561
|
+
<!-- Description -->
|
|
54562
|
+
<p [ngClass]="textClasses()" class="text-base leading-relaxed mb-6">
|
|
54563
|
+
Integrating Google Analytics is essential. We use it to pull the majority of your data in a read-only format, ensuring no changes are made to your analytics. Please make sure you have access to the Google Analytics property associated with this shop to ensure proper integration.
|
|
54564
|
+
</p>
|
|
54565
|
+
|
|
54566
|
+
<!-- Continue with Google Button -->
|
|
54567
|
+
<div class="mb-6">
|
|
54568
|
+
<button type="button" class="gsi-material-button" (click)="googleButtonClick.emit()">
|
|
54569
|
+
<div class="gsi-material-button-state"></div>
|
|
54570
|
+
<div class="gsi-material-button-content-wrapper">
|
|
54571
|
+
<div class="gsi-material-button-icon">
|
|
54572
|
+
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" xmlns:xlink="http://www.w3.org/1999/xlink" style="display: block;">
|
|
54573
|
+
<path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path>
|
|
54574
|
+
<path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path>
|
|
54575
|
+
<path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path>
|
|
54576
|
+
<path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path>
|
|
54577
|
+
<path fill="none" d="M0 0h48v48H0z"></path>
|
|
54578
|
+
</svg>
|
|
54579
|
+
</div>
|
|
54580
|
+
<span class="gsi-material-button-contents">Continue with Google</span>
|
|
54581
|
+
</div>
|
|
54582
|
+
</button>
|
|
54583
|
+
</div>
|
|
54584
|
+
|
|
54585
|
+
<!-- Note Section -->
|
|
54586
|
+
<div [ngClass]="noteBoxClasses()" class="p-4 rounded-lg border flex items-start gap-3">
|
|
54587
|
+
<svg class="w-5 h-5 flex-shrink-0 mt-0.5" [ngClass]="noteIconClasses()" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
54588
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
54589
|
+
</svg>
|
|
54590
|
+
<div class="flex-1">
|
|
54591
|
+
<p [ngClass]="noteTextClasses()" class="text-sm leading-relaxed">
|
|
54592
|
+
<strong class="font-semibold">Note:</strong> When you click "Continue with Google", you'll be asked to sign in to your Google account and select the Analytics property associated with your shop.
|
|
54593
|
+
</p>
|
|
54594
|
+
</div>
|
|
54595
|
+
</div>
|
|
54596
|
+
|
|
54597
|
+
<!-- Expandable Data Usage Card -->
|
|
54598
|
+
<div [ngClass]="expandableCardClasses()" class="mt-6 rounded-lg border overflow-hidden">
|
|
54599
|
+
<!-- Header (Clickable) -->
|
|
54600
|
+
<div
|
|
54601
|
+
(click)="toggleExpanded()"
|
|
54602
|
+
[ngClass]="expandableHeaderClasses()"
|
|
54603
|
+
class="px-4 py-4 cursor-pointer flex items-center justify-between gap-3 transition-colors duration-200">
|
|
54604
|
+
<span [ngClass]="expandableHeaderTextClasses()" class="text-base font-semibold">
|
|
54605
|
+
How do we use your Google Analytics data?
|
|
54606
|
+
</span>
|
|
54607
|
+
<svg
|
|
54608
|
+
[ngClass]="chevronClasses()"
|
|
54609
|
+
class="w-5 h-5 flex-shrink-0 transition-transform duration-300"
|
|
54610
|
+
[class.rotate-180]="isExpanded()"
|
|
54611
|
+
fill="none"
|
|
54612
|
+
stroke="currentColor"
|
|
54613
|
+
viewBox="0 0 24 24">
|
|
54614
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
|
|
54615
|
+
</svg>
|
|
54616
|
+
</div>
|
|
54617
|
+
|
|
54618
|
+
<!-- Expanded Content -->
|
|
54619
|
+
<div
|
|
54620
|
+
class="transition-all duration-300 ease-in-out overflow-hidden"
|
|
54621
|
+
[class.max-h-0]="!isExpanded()"
|
|
54622
|
+
[class.opacity-0]="!isExpanded()"
|
|
54623
|
+
[class.max-h-[1000px]]="isExpanded()"
|
|
54624
|
+
[class.opacity-100]="isExpanded()">
|
|
54625
|
+
<div [ngClass]="expandedContentClasses()" class="px-4 pb-4 pt-2">
|
|
54626
|
+
<p [ngClass]="expandedTextClasses()" class="text-sm leading-relaxed mb-4">
|
|
54627
|
+
We request access to your Google Analytics data to aggregate this information into funnel stages and display trends within our application. This allows us to provide you with a clear overview of your web performance. By analyzing the data, we can map out recommendations, measure the impact of your current strategies, and suggest actionable next steps for improvement.
|
|
54628
|
+
</p>
|
|
54629
|
+
<p [ngClass]="expandedTextClasses()" class="text-sm leading-relaxed">
|
|
54630
|
+
Symphiq's use and transfer to any other app of information received from Google APIs will adhere to <strong class="font-bold">Google API Services User Data Policy</strong> including the Limited Use requirements.
|
|
54631
|
+
</p>
|
|
54632
|
+
</div>
|
|
54633
|
+
</div>
|
|
54634
|
+
</div>
|
|
54635
|
+
</div>
|
|
54636
|
+
</div>
|
|
54637
|
+
</div>
|
|
54638
|
+
</div>
|
|
54639
|
+
</div>
|
|
54640
|
+
</main>
|
|
54641
|
+
</div>
|
|
54642
|
+
</div>
|
|
54659
54643
|
`, styles: [":host{display:block}.animated-bubbles{overflow:hidden}.animated-bubbles:before,.animated-bubbles:after{content:\"\";position:absolute;border-radius:50%;animation:float 20s infinite ease-in-out;opacity:.05}.animated-bubbles:before{width:600px;height:600px;background:radial-gradient(circle,#3b82f6 0%,transparent 70%);top:-300px;left:-300px;animation-delay:-5s}.animated-bubbles:after{width:800px;height:800px;background:radial-gradient(circle,#06b6d4 0%,transparent 70%);bottom:-400px;right:-400px;animation-delay:-10s}.animated-bubbles.light-mode:before,.animated-bubbles.light-mode:after{opacity:.03}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(50px,-50px) scale(1.1)}66%{transform:translate(-30px,30px) scale(.9)}}:host.light .gsi-material-button{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;border:1px solid #747775;-webkit-border-radius:4px;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#1f1f1f;cursor:pointer;font-family:Roboto,arial,sans-serif;font-size:14px;height:40px;letter-spacing:.25px;outline:none;overflow:hidden;padding:0 12px;position:relative;text-align:center;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;vertical-align:middle;white-space:nowrap;width:auto;max-width:400px;min-width:min-content}:host.light .gsi-material-button .gsi-material-button-icon{height:20px;margin-right:12px;min-width:20px;width:20px}:host.light .gsi-material-button .gsi-material-button-content-wrapper{-webkit-align-items:center;align-items:center;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;height:100%;justify-content:space-between;position:relative;width:100%}:host.light .gsi-material-button .gsi-material-button-contents{-webkit-flex-grow:1;flex-grow:1;font-family:Roboto,arial,sans-serif;font-weight:500;overflow:hidden;text-overflow:ellipsis;vertical-align:top}:host.light .gsi-material-button .gsi-material-button-state{-webkit-transition:opacity .218s;transition:opacity .218s;inset:0;opacity:0;position:absolute}:host.light .gsi-material-button:disabled{cursor:default;background-color:#ffffff61;border-color:#1f1f1f1f}:host.light .gsi-material-button:disabled .gsi-material-button-contents{opacity:38%}:host.light .gsi-material-button:disabled .gsi-material-button-icon{opacity:38%}:host.light .gsi-material-button:not(:disabled):active .gsi-material-button-state,:host.light .gsi-material-button:not(:disabled):focus .gsi-material-button-state{background-color:#303030;opacity:12%}:host.light .gsi-material-button:not(:disabled):hover{-webkit-box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);box-shadow:0 1px 2px #3c40434d,0 1px 3px 1px #3c404326}:host.light .gsi-material-button:not(:disabled):hover .gsi-material-button-state{background-color:#303030;opacity:8%}:host.dark .gsi-material-button{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-appearance:none;background-color:#131314;background-image:none;border:1px solid #747775;-webkit-border-radius:4px;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#e3e3e3;cursor:pointer;font-family:Roboto,arial,sans-serif;font-size:14px;height:40px;letter-spacing:.25px;outline:none;overflow:hidden;padding:0 12px;position:relative;text-align:center;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;vertical-align:middle;white-space:nowrap;width:auto;max-width:400px;min-width:min-content;border-color:#8e918f}:host.dark .gsi-material-button .gsi-material-button-icon{height:20px;margin-right:12px;min-width:20px;width:20px}:host.dark .gsi-material-button .gsi-material-button-content-wrapper{-webkit-align-items:center;align-items:center;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;height:100%;justify-content:space-between;position:relative;width:100%}:host.dark .gsi-material-button .gsi-material-button-contents{-webkit-flex-grow:1;flex-grow:1;font-family:Roboto,arial,sans-serif;font-weight:500;overflow:hidden;text-overflow:ellipsis;vertical-align:top}:host.dark .gsi-material-button .gsi-material-button-state{-webkit-transition:opacity .218s;transition:opacity .218s;inset:0;opacity:0;position:absolute}:host.dark .gsi-material-button:disabled{cursor:default;background-color:#13131461;border-color:#8e918f1f}:host.dark .gsi-material-button:disabled .gsi-material-button-state{background-color:#e3e3e31f}:host.dark .gsi-material-button:disabled .gsi-material-button-contents{opacity:38%}:host.dark .gsi-material-button:disabled .gsi-material-button-icon{opacity:38%}:host.dark .gsi-material-button:not(:disabled):active .gsi-material-button-state,:host.dark .gsi-material-button:not(:disabled):focus .gsi-material-button-state{background-color:#fff;opacity:12%}:host.dark .gsi-material-button:not(:disabled):hover{-webkit-box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);box-shadow:0 1px 2px #3c40434d,0 1px 3px 1px #3c404326}:host.dark .gsi-material-button:not(:disabled):hover .gsi-material-button-state{background-color:#fff;opacity:8%}\n"] }]
|
|
54660
54644
|
}], () => [], { embedded: [{ type: i0.Input, args: [{ isSignal: true, alias: "embedded", required: false }] }], parentHeaderOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentHeaderOffset", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], scrollEvent: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollEvent", required: false }] }], scrollElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollElement", required: false }] }], forDemo: [{ type: i0.Input, args: [{ isSignal: true, alias: "forDemo", required: false }] }], maxAccessibleStepId: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxAccessibleStepId", required: false }] }], stepClick: [{ type: i0.Output, args: ["stepClick"] }], nextStepClick: [{ type: i0.Output, args: ["nextStepClick"] }], googleButtonClick: [{ type: i0.Output, args: ["googleButtonClick"] }], onScroll: [{
|
|
54661
54645
|
type: HostListener,
|
|
54662
54646
|
args: ['window:scroll', ['$event']]
|
|
54663
54647
|
}] }); })();
|
|
54664
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqConnectGaDashboardComponent, { className: "SymphiqConnectGaDashboardComponent", filePath: "lib/components/connect-ga-dashboard/symphiq-connect-ga-dashboard.component.ts", lineNumber:
|
|
54648
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqConnectGaDashboardComponent, { className: "SymphiqConnectGaDashboardComponent", filePath: "lib/components/connect-ga-dashboard/symphiq-connect-ga-dashboard.component.ts", lineNumber: 462 }); })();
|
|
54665
54649
|
|
|
54666
54650
|
function HierarchyDisplayComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
54667
54651
|
i0.ɵɵelementStart(0, "div", 1)(1, "div", 1);
|
|
@@ -57580,85 +57564,85 @@ class RecommendationsTiledGridComponent {
|
|
|
57580
57564
|
standalone: true,
|
|
57581
57565
|
imports: [CommonModule, SimplifiedRecommendationCardComponent],
|
|
57582
57566
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
57583
|
-
template: `
|
|
57584
|
-
<div [ngClass]="containerClasses()" class="rounded-2xl border shadow-lg overflow-hidden">
|
|
57585
|
-
<div [ngClass]="headerClasses()" class="px-6 py-5 border-b">
|
|
57586
|
-
<div class="flex items-center justify-between">
|
|
57587
|
-
<div class="flex items-center gap-3">
|
|
57588
|
-
<div [ngClass]="iconContainerClasses()" class="p-2.5 rounded-lg">
|
|
57589
|
-
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
57590
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path>
|
|
57591
|
-
</svg>
|
|
57592
|
-
</div>
|
|
57593
|
-
<div>
|
|
57594
|
-
<h2 [ngClass]="titleClasses()" class="text-xl font-bold">
|
|
57595
|
-
Strategic Insights & Recommendations
|
|
57596
|
-
</h2>
|
|
57597
|
-
<p [ngClass]="subtitleClasses()" class="text-sm mt-0.5">
|
|
57598
|
-
{{ recommendations().length }} personalized recommendations based on your business profile
|
|
57599
|
-
</p>
|
|
57600
|
-
</div>
|
|
57601
|
-
</div>
|
|
57602
|
-
@if (recommendations().length > 0) {
|
|
57603
|
-
<div [ngClass]="countBadgeClasses()" class="px-3 py-1.5 rounded-lg font-semibold text-sm">
|
|
57604
|
-
{{ recommendations().length }}
|
|
57605
|
-
</div>
|
|
57606
|
-
}
|
|
57607
|
-
</div>
|
|
57608
|
-
</div>
|
|
57609
|
-
|
|
57610
|
-
<div [ngClass]="contentClasses()" class="p-6">
|
|
57611
|
-
@if (recommendations().length > 0) {
|
|
57612
|
-
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 items-start">
|
|
57613
|
-
@for (recommendation of sortedRecommendations(); track recommendation.id; let idx = $index) {
|
|
57614
|
-
<symphiq-simplified-recommendation-card
|
|
57615
|
-
[item]="recommendation"
|
|
57616
|
-
[viewMode]="viewMode()"
|
|
57617
|
-
[animationIndex]="idx"
|
|
57618
|
-
(viewMoreClick)="viewMoreClick.emit($event)"
|
|
57619
|
-
/>
|
|
57620
|
-
}
|
|
57621
|
-
</div>
|
|
57622
|
-
} @else if (isLoading()) {
|
|
57623
|
-
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 items-start">
|
|
57624
|
-
@for (i of [0, 1, 2]; track i) {
|
|
57625
|
-
<div [ngClass]="skeletonCardClasses()" class="rounded-xl border p-5 animate-pulse">
|
|
57626
|
-
<div class="flex items-start gap-3 mb-4">
|
|
57627
|
-
<div [ngClass]="skeletonIconClasses()" class="w-10 h-10 rounded-lg"></div>
|
|
57628
|
-
<div class="flex-1 space-y-2">
|
|
57629
|
-
<div [ngClass]="skeletonLineClasses()" class="h-4 rounded w-3/4"></div>
|
|
57630
|
-
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-1/2"></div>
|
|
57631
|
-
</div>
|
|
57632
|
-
</div>
|
|
57633
|
-
<div class="space-y-2 mb-4">
|
|
57634
|
-
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-full"></div>
|
|
57635
|
-
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-5/6"></div>
|
|
57636
|
-
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-4/6"></div>
|
|
57637
|
-
</div>
|
|
57638
|
-
<div class="flex items-center justify-between">
|
|
57639
|
-
<div [ngClass]="skeletonLineClasses()" class="h-6 rounded-full w-16"></div>
|
|
57640
|
-
<div [ngClass]="skeletonLineClasses()" class="h-8 rounded-lg w-24"></div>
|
|
57641
|
-
</div>
|
|
57642
|
-
</div>
|
|
57643
|
-
}
|
|
57644
|
-
</div>
|
|
57645
|
-
} @else {
|
|
57646
|
-
<div [ngClass]="emptyStateClasses()" class="text-center py-12 rounded-xl border-2 border-dashed">
|
|
57647
|
-
<div [ngClass]="emptyIconClasses()" class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center">
|
|
57648
|
-
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
57649
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
|
|
57650
|
-
</svg>
|
|
57651
|
-
</div>
|
|
57652
|
-
<h3 [ngClass]="emptyTitleClasses()" class="text-lg font-semibold mb-2">
|
|
57653
|
-
No Recommendations Yet
|
|
57654
|
-
</h3>
|
|
57655
|
-
<p [ngClass]="emptyDescriptionClasses()" class="text-sm">
|
|
57656
|
-
Complete your business profile to receive personalized strategic recommendations
|
|
57657
|
-
</p>
|
|
57658
|
-
</div>
|
|
57659
|
-
}
|
|
57660
|
-
</div>
|
|
57661
|
-
</div>
|
|
57567
|
+
template: `
|
|
57568
|
+
<div [ngClass]="containerClasses()" class="rounded-2xl border shadow-lg overflow-hidden">
|
|
57569
|
+
<div [ngClass]="headerClasses()" class="px-6 py-5 border-b">
|
|
57570
|
+
<div class="flex items-center justify-between">
|
|
57571
|
+
<div class="flex items-center gap-3">
|
|
57572
|
+
<div [ngClass]="iconContainerClasses()" class="p-2.5 rounded-lg">
|
|
57573
|
+
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
57574
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path>
|
|
57575
|
+
</svg>
|
|
57576
|
+
</div>
|
|
57577
|
+
<div>
|
|
57578
|
+
<h2 [ngClass]="titleClasses()" class="text-xl font-bold">
|
|
57579
|
+
Strategic Insights & Recommendations
|
|
57580
|
+
</h2>
|
|
57581
|
+
<p [ngClass]="subtitleClasses()" class="text-sm mt-0.5">
|
|
57582
|
+
{{ recommendations().length }} personalized recommendations based on your business profile
|
|
57583
|
+
</p>
|
|
57584
|
+
</div>
|
|
57585
|
+
</div>
|
|
57586
|
+
@if (recommendations().length > 0) {
|
|
57587
|
+
<div [ngClass]="countBadgeClasses()" class="px-3 py-1.5 rounded-lg font-semibold text-sm">
|
|
57588
|
+
{{ recommendations().length }}
|
|
57589
|
+
</div>
|
|
57590
|
+
}
|
|
57591
|
+
</div>
|
|
57592
|
+
</div>
|
|
57593
|
+
|
|
57594
|
+
<div [ngClass]="contentClasses()" class="p-6">
|
|
57595
|
+
@if (recommendations().length > 0) {
|
|
57596
|
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 items-start">
|
|
57597
|
+
@for (recommendation of sortedRecommendations(); track recommendation.id; let idx = $index) {
|
|
57598
|
+
<symphiq-simplified-recommendation-card
|
|
57599
|
+
[item]="recommendation"
|
|
57600
|
+
[viewMode]="viewMode()"
|
|
57601
|
+
[animationIndex]="idx"
|
|
57602
|
+
(viewMoreClick)="viewMoreClick.emit($event)"
|
|
57603
|
+
/>
|
|
57604
|
+
}
|
|
57605
|
+
</div>
|
|
57606
|
+
} @else if (isLoading()) {
|
|
57607
|
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 items-start">
|
|
57608
|
+
@for (i of [0, 1, 2]; track i) {
|
|
57609
|
+
<div [ngClass]="skeletonCardClasses()" class="rounded-xl border p-5 animate-pulse">
|
|
57610
|
+
<div class="flex items-start gap-3 mb-4">
|
|
57611
|
+
<div [ngClass]="skeletonIconClasses()" class="w-10 h-10 rounded-lg"></div>
|
|
57612
|
+
<div class="flex-1 space-y-2">
|
|
57613
|
+
<div [ngClass]="skeletonLineClasses()" class="h-4 rounded w-3/4"></div>
|
|
57614
|
+
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-1/2"></div>
|
|
57615
|
+
</div>
|
|
57616
|
+
</div>
|
|
57617
|
+
<div class="space-y-2 mb-4">
|
|
57618
|
+
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-full"></div>
|
|
57619
|
+
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-5/6"></div>
|
|
57620
|
+
<div [ngClass]="skeletonLineClasses()" class="h-3 rounded w-4/6"></div>
|
|
57621
|
+
</div>
|
|
57622
|
+
<div class="flex items-center justify-between">
|
|
57623
|
+
<div [ngClass]="skeletonLineClasses()" class="h-6 rounded-full w-16"></div>
|
|
57624
|
+
<div [ngClass]="skeletonLineClasses()" class="h-8 rounded-lg w-24"></div>
|
|
57625
|
+
</div>
|
|
57626
|
+
</div>
|
|
57627
|
+
}
|
|
57628
|
+
</div>
|
|
57629
|
+
} @else {
|
|
57630
|
+
<div [ngClass]="emptyStateClasses()" class="text-center py-12 rounded-xl border-2 border-dashed">
|
|
57631
|
+
<div [ngClass]="emptyIconClasses()" class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center">
|
|
57632
|
+
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
57633
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
|
|
57634
|
+
</svg>
|
|
57635
|
+
</div>
|
|
57636
|
+
<h3 [ngClass]="emptyTitleClasses()" class="text-lg font-semibold mb-2">
|
|
57637
|
+
No Recommendations Yet
|
|
57638
|
+
</h3>
|
|
57639
|
+
<p [ngClass]="emptyDescriptionClasses()" class="text-sm">
|
|
57640
|
+
Complete your business profile to receive personalized strategic recommendations
|
|
57641
|
+
</p>
|
|
57642
|
+
</div>
|
|
57643
|
+
}
|
|
57644
|
+
</div>
|
|
57645
|
+
</div>
|
|
57662
57646
|
`
|
|
57663
57647
|
}]
|
|
57664
57648
|
}], null, { recommendations: [{ type: i0.Input, args: [{ isSignal: true, alias: "recommendations", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], viewMoreClick: [{ type: i0.Output, args: ["viewMoreClick"] }] }); })();
|
|
@@ -58186,87 +58170,87 @@ class ContentGenerationProgressComponent {
|
|
|
58186
58170
|
}
|
|
58187
58171
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ContentGenerationProgressComponent, [{
|
|
58188
58172
|
type: Component,
|
|
58189
|
-
args: [{ selector: 'symphiq-content-generation-progress', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
58190
|
-
<div [ngClass]="containerClasses()" class="min-h-[60vh] flex items-center justify-center px-4 py-12">
|
|
58191
|
-
<div class="max-w-3xl w-full space-y-8">
|
|
58192
|
-
<!-- Title Section -->
|
|
58193
|
-
<div class="text-center space-y-3">
|
|
58194
|
-
<div class="flex items-center justify-center mb-4">
|
|
58195
|
-
<div [ngClass]="iconContainerClasses()" class="relative w-20 h-20 rounded-2xl flex items-center justify-center icon-pulse">
|
|
58196
|
-
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
58197
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
|
58198
|
-
</svg>
|
|
58199
|
-
<div class="absolute inset-0 rounded-2xl icon-glow"></div>
|
|
58200
|
-
</div>
|
|
58201
|
-
</div>
|
|
58202
|
-
|
|
58203
|
-
<h2 [ngClass]="titleClasses()" class="text-3xl sm:text-4xl font-bold">
|
|
58204
|
-
{{ title() }}
|
|
58205
|
-
</h2>
|
|
58206
|
-
|
|
58207
|
-
<p [ngClass]="subtitleClasses()" class="text-base sm:text-lg max-w-2xl mx-auto">
|
|
58208
|
-
{{ subtitle() }}
|
|
58209
|
-
</p>
|
|
58210
|
-
</div>
|
|
58211
|
-
|
|
58212
|
-
<!-- Progress Section -->
|
|
58213
|
-
<div class="space-y-4">
|
|
58214
|
-
<!-- Progress Message -->
|
|
58215
|
-
<div class="text-center">
|
|
58216
|
-
<p [ngClass]="progressMessageClasses()" class="text-lg sm:text-xl font-medium message-fade">
|
|
58217
|
-
{{ progressMessage() }}
|
|
58218
|
-
</p>
|
|
58219
|
-
</div>
|
|
58220
|
-
|
|
58221
|
-
<!-- Progress Bar Container -->
|
|
58222
|
-
<div [ngClass]="progressBarContainerClasses()" class="relative h-3 rounded-full" style="overflow: visible;">
|
|
58223
|
-
<!-- Background Track -->
|
|
58224
|
-
<div [ngClass]="progressBarBackgroundClasses()" class="absolute inset-0 rounded-full"></div>
|
|
58225
|
-
|
|
58226
|
-
<!-- Solid Fill with Gradient -->
|
|
58227
|
-
<div
|
|
58228
|
-
[ngClass]="progressBarFillClasses()"
|
|
58229
|
-
[style.width.%]="progressPercentage()"
|
|
58230
|
-
class="absolute inset-y-0 left-0 rounded-full transition-all duration-700 ease-out overflow-hidden">
|
|
58231
|
-
<!-- Inner shimmer effect -->
|
|
58232
|
-
<div class="absolute inset-0 shimmer-effect"></div>
|
|
58233
|
-
</div>
|
|
58234
|
-
|
|
58235
|
-
<!-- Animated Dots Overlay (container positioned at progress edge, dots animate within) -->
|
|
58236
|
-
@if (progressPercentage() > 0 && progressPercentage() < 100) {
|
|
58237
|
-
<div
|
|
58238
|
-
class="absolute pointer-events-none"
|
|
58239
|
-
[style.left.%]="progressPercentage()"
|
|
58240
|
-
style="right: 0; top: -4px; bottom: -4px; overflow: visible;">
|
|
58241
|
-
<div class="animated-dot animated-dot-1" [style.background-color]="dotColor()"></div>
|
|
58242
|
-
<div class="animated-dot animated-dot-2" [style.background-color]="dotColor()"></div>
|
|
58243
|
-
<div class="animated-dot animated-dot-3" [style.background-color]="dotColor()"></div>
|
|
58244
|
-
<div class="animated-dot animated-dot-4" [style.background-color]="dotColor()"></div>
|
|
58245
|
-
<div class="animated-dot animated-dot-5" [style.background-color]="dotColor()"></div>
|
|
58246
|
-
<div class="animated-dot animated-dot-6" [style.background-color]="dotColor()"></div>
|
|
58247
|
-
</div>
|
|
58248
|
-
}
|
|
58249
|
-
|
|
58250
|
-
<!-- Glow effect at the progress edge -->
|
|
58251
|
-
@if (progressPercentage() > 0 && progressPercentage() < 100) {
|
|
58252
|
-
<div
|
|
58253
|
-
[ngClass]="progressGlowClasses()"
|
|
58254
|
-
[style.left.%]="progressPercentage()"
|
|
58255
|
-
class="absolute top-1/2 -translate-y-1/2 w-4 h-4 rounded-full blur-md transition-all duration-700 ease-out"
|
|
58256
|
-
style="margin-left: -8px;">
|
|
58257
|
-
</div>
|
|
58258
|
-
}
|
|
58259
|
-
</div>
|
|
58260
|
-
|
|
58261
|
-
<!-- Progress Percentage -->
|
|
58262
|
-
<div class="text-center">
|
|
58263
|
-
<span [ngClass]="percentageClasses()" class="text-sm font-medium tabular-nums">
|
|
58264
|
-
{{ progressPercentage() }}% complete
|
|
58265
|
-
</span>
|
|
58266
|
-
</div>
|
|
58267
|
-
</div>
|
|
58268
|
-
</div>
|
|
58269
|
-
</div>
|
|
58173
|
+
args: [{ selector: 'symphiq-content-generation-progress', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
58174
|
+
<div [ngClass]="containerClasses()" class="min-h-[60vh] flex items-center justify-center px-4 py-12">
|
|
58175
|
+
<div class="max-w-3xl w-full space-y-8">
|
|
58176
|
+
<!-- Title Section -->
|
|
58177
|
+
<div class="text-center space-y-3">
|
|
58178
|
+
<div class="flex items-center justify-center mb-4">
|
|
58179
|
+
<div [ngClass]="iconContainerClasses()" class="relative w-20 h-20 rounded-2xl flex items-center justify-center icon-pulse">
|
|
58180
|
+
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
58181
|
+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
|
58182
|
+
</svg>
|
|
58183
|
+
<div class="absolute inset-0 rounded-2xl icon-glow"></div>
|
|
58184
|
+
</div>
|
|
58185
|
+
</div>
|
|
58186
|
+
|
|
58187
|
+
<h2 [ngClass]="titleClasses()" class="text-3xl sm:text-4xl font-bold">
|
|
58188
|
+
{{ title() }}
|
|
58189
|
+
</h2>
|
|
58190
|
+
|
|
58191
|
+
<p [ngClass]="subtitleClasses()" class="text-base sm:text-lg max-w-2xl mx-auto">
|
|
58192
|
+
{{ subtitle() }}
|
|
58193
|
+
</p>
|
|
58194
|
+
</div>
|
|
58195
|
+
|
|
58196
|
+
<!-- Progress Section -->
|
|
58197
|
+
<div class="space-y-4">
|
|
58198
|
+
<!-- Progress Message -->
|
|
58199
|
+
<div class="text-center">
|
|
58200
|
+
<p [ngClass]="progressMessageClasses()" class="text-lg sm:text-xl font-medium message-fade">
|
|
58201
|
+
{{ progressMessage() }}
|
|
58202
|
+
</p>
|
|
58203
|
+
</div>
|
|
58204
|
+
|
|
58205
|
+
<!-- Progress Bar Container -->
|
|
58206
|
+
<div [ngClass]="progressBarContainerClasses()" class="relative h-3 rounded-full" style="overflow: visible;">
|
|
58207
|
+
<!-- Background Track -->
|
|
58208
|
+
<div [ngClass]="progressBarBackgroundClasses()" class="absolute inset-0 rounded-full"></div>
|
|
58209
|
+
|
|
58210
|
+
<!-- Solid Fill with Gradient -->
|
|
58211
|
+
<div
|
|
58212
|
+
[ngClass]="progressBarFillClasses()"
|
|
58213
|
+
[style.width.%]="progressPercentage()"
|
|
58214
|
+
class="absolute inset-y-0 left-0 rounded-full transition-all duration-700 ease-out overflow-hidden">
|
|
58215
|
+
<!-- Inner shimmer effect -->
|
|
58216
|
+
<div class="absolute inset-0 shimmer-effect"></div>
|
|
58217
|
+
</div>
|
|
58218
|
+
|
|
58219
|
+
<!-- Animated Dots Overlay (container positioned at progress edge, dots animate within) -->
|
|
58220
|
+
@if (progressPercentage() > 0 && progressPercentage() < 100) {
|
|
58221
|
+
<div
|
|
58222
|
+
class="absolute pointer-events-none"
|
|
58223
|
+
[style.left.%]="progressPercentage()"
|
|
58224
|
+
style="right: 0; top: -4px; bottom: -4px; overflow: visible;">
|
|
58225
|
+
<div class="animated-dot animated-dot-1" [style.background-color]="dotColor()"></div>
|
|
58226
|
+
<div class="animated-dot animated-dot-2" [style.background-color]="dotColor()"></div>
|
|
58227
|
+
<div class="animated-dot animated-dot-3" [style.background-color]="dotColor()"></div>
|
|
58228
|
+
<div class="animated-dot animated-dot-4" [style.background-color]="dotColor()"></div>
|
|
58229
|
+
<div class="animated-dot animated-dot-5" [style.background-color]="dotColor()"></div>
|
|
58230
|
+
<div class="animated-dot animated-dot-6" [style.background-color]="dotColor()"></div>
|
|
58231
|
+
</div>
|
|
58232
|
+
}
|
|
58233
|
+
|
|
58234
|
+
<!-- Glow effect at the progress edge -->
|
|
58235
|
+
@if (progressPercentage() > 0 && progressPercentage() < 100) {
|
|
58236
|
+
<div
|
|
58237
|
+
[ngClass]="progressGlowClasses()"
|
|
58238
|
+
[style.left.%]="progressPercentage()"
|
|
58239
|
+
class="absolute top-1/2 -translate-y-1/2 w-4 h-4 rounded-full blur-md transition-all duration-700 ease-out"
|
|
58240
|
+
style="margin-left: -8px;">
|
|
58241
|
+
</div>
|
|
58242
|
+
}
|
|
58243
|
+
</div>
|
|
58244
|
+
|
|
58245
|
+
<!-- Progress Percentage -->
|
|
58246
|
+
<div class="text-center">
|
|
58247
|
+
<span [ngClass]="percentageClasses()" class="text-sm font-medium tabular-nums">
|
|
58248
|
+
{{ progressPercentage() }}% complete
|
|
58249
|
+
</span>
|
|
58250
|
+
</div>
|
|
58251
|
+
</div>
|
|
58252
|
+
</div>
|
|
58253
|
+
</div>
|
|
58270
58254
|
`, styles: ["@keyframes icon-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}@keyframes icon-glow-pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes dots-move{0%{left:0%;opacity:0}3%{left:3%;opacity:1}97%{left:97%;opacity:1}to{left:100%;opacity:0}}@keyframes dots-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.4)}}@keyframes message-fade{0%,to{opacity:1}50%{opacity:.7}}.icon-pulse{animation:icon-pulse 2s ease-in-out infinite}.icon-glow{animation:icon-glow-pulse 2s ease-in-out infinite}.shimmer-effect{background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.3) 50%,transparent 100%);animation:shimmer 2s ease-in-out infinite}.message-fade{animation:message-fade 3s ease-in-out infinite}.animated-dot{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;margin-top:-6px;margin-left:-6px;animation:dots-move 6s linear infinite,dots-pulse 2s ease-in-out infinite;will-change:left,transform,opacity;z-index:20;box-shadow:0 0 8px currentColor,0 0 16px currentColor}.animated-dot-1{animation-delay:0s,0s}.animated-dot-2{animation-delay:1s,0s}.animated-dot-3{animation-delay:2s,0s}.animated-dot-4{animation-delay:3s,0s}.animated-dot-5{animation-delay:4s,0s}.animated-dot-6{animation-delay:5s,0s}\n"] }]
|
|
58271
58255
|
}], null, { itemStatus: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemStatus", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }] }); })();
|
|
58272
58256
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ContentGenerationProgressComponent, { className: "ContentGenerationProgressComponent", filePath: "lib/components/shared/content-generation-progress.component.ts", lineNumber: 222 }); })();
|
|
@@ -58558,7 +58542,9 @@ class SymphiqBusinessAnalysisDashboardComponent {
|
|
|
58558
58542
|
this.profileContextService = inject(ProfileContextService);
|
|
58559
58543
|
this.searchService = inject(BusinessProfileSearchService);
|
|
58560
58544
|
this.modalService = inject(ModalService);
|
|
58545
|
+
this.confettiService = inject(ConfettiService);
|
|
58561
58546
|
this.currentProfile = signal(undefined, ...(ngDevMode ? [{ debugName: "currentProfile" }] : []));
|
|
58547
|
+
this.previousContentStatus = signal(undefined, ...(ngDevMode ? [{ debugName: "previousContentStatus" }] : []));
|
|
58562
58548
|
this.COLLAPSE_THRESHOLD = 20;
|
|
58563
58549
|
this.EXPAND_THRESHOLD = 10;
|
|
58564
58550
|
this.embeddedScrollEffect = effect(() => {
|
|
@@ -58648,6 +58634,19 @@ class SymphiqBusinessAnalysisDashboardComponent {
|
|
|
58648
58634
|
this.profileContextService.indexProfile(profile.profileStructured.sections, recommendations);
|
|
58649
58635
|
}
|
|
58650
58636
|
});
|
|
58637
|
+
effect(() => {
|
|
58638
|
+
const currentStatus = this.profile()?.selfContentStatus;
|
|
58639
|
+
const prevStatus = this.previousContentStatus();
|
|
58640
|
+
if (prevStatus === AiDynamicContentStatusEnum.GENERATING &&
|
|
58641
|
+
currentStatus === AiDynamicContentStatusEnum.GENERATED) {
|
|
58642
|
+
this.confettiService.trigger({
|
|
58643
|
+
intensity: 'celebration',
|
|
58644
|
+
delay: 200,
|
|
58645
|
+
viewMode: this.viewMode(),
|
|
58646
|
+
});
|
|
58647
|
+
}
|
|
58648
|
+
this.previousContentStatus.set(currentStatus);
|
|
58649
|
+
});
|
|
58651
58650
|
}
|
|
58652
58651
|
onScroll() {
|
|
58653
58652
|
this.headerScrollService.handleScroll(this.embedded());
|
|
@@ -59365,7 +59364,7 @@ class SymphiqBusinessAnalysisDashboardComponent {
|
|
|
59365
59364
|
type: HostListener,
|
|
59366
59365
|
args: ['document:keydown', ['$event']]
|
|
59367
59366
|
}] }); })();
|
|
59368
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqBusinessAnalysisDashboardComponent, { className: "SymphiqBusinessAnalysisDashboardComponent", filePath: "lib/components/business-analysis-dashboard/symphiq-business-analysis-dashboard.component.ts", lineNumber:
|
|
59367
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqBusinessAnalysisDashboardComponent, { className: "SymphiqBusinessAnalysisDashboardComponent", filePath: "lib/components/business-analysis-dashboard/symphiq-business-analysis-dashboard.component.ts", lineNumber: 336 }); })();
|
|
59369
59368
|
|
|
59370
59369
|
function DashboardHeaderComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
|
|
59371
59370
|
i0.ɵɵelement(0, "div", 6);
|