simpo-component-library 3.6.963 → 3.6.967

package/fesm2022/simpo-component-library.mjs

@@ -1,5 +1,5 @@
 import * as i3 from '@angular/common';
-import { CommonModule, isPlatformBrowser, NgStyle, NgFor, DOCUMENT, NgIf } from '@angular/common';
+import { CommonModule, isPlatformBrowser, NgStyle, NgFor, DOCUMENT, DatePipe, NgIf } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Component, Input, EventEmitter, Injectable, Directive, HostListener, ElementRef, Renderer2, forwardRef, Inject, inject, PLATFORM_ID, Output, ViewChild, Pipe, InjectionToken, Optional, NgModule, ViewChildren } from '@angular/core';
 import { MatGridListModule } from '@angular/material/grid-list';
@@ -2599,6 +2599,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     args: [LOCAL_STORAGE]
                 }] }] });
 
+class BlogCategory {
+    constructor(json) {
+        this.id = json?.['id'];
+        this.businessId = json?.['businessId'];
+        this.categoryName = json?.['categoryName'];
+        this.description = json?.['description'];
+        this.blogsCreatedCount = json?.['blogsCreatedCount'];
+        this.createdById = json?.['createdById'];
+        this.createdByName = json?.['createdByName'];
+        this.createdTimeStamp = json?.['createdTimeStamp'];
+    }
+}
+
 class Product {
     // createdTimeStamp: string
     // updatedTimeStamp: string
@@ -2670,7 +2683,9 @@ class checkItemAlreadyAdded {
 }
 
 class RestService {
-    constructor(http, BASE_URL, ECOMMERCE_URL, CMIS_URL, cookieService, storage, PASSBOOK_URL, APPOINTMENT_URL) {
+    constructor(http, BASE_URL, ECOMMERCE_URL, CMIS_URL, cookieService, storage, PASSBOOK_URL, APPOINTMENT_URL
+    // @Inject(RECOMMENDATION_URL) private RECOMMENDATION_URL: string
+    ) {
         this.http = http;
         this.BASE_URL = BASE_URL;
         this.ECOMMERCE_URL = ECOMMERCE_URL;
@@ -2690,7 +2705,8 @@ class RestService {
     }
     // passBookUrl: string = "https://prod-passbook.simpo.ai/";
     getBusinessDetails() {
-        this.isJewellery = this.storage.getItem('isMaterialBasedPricing') == 'true' ? true : false;
+        this.isJewellery =
+            this.storage.getItem('isMaterialBasedPricing') == 'true' ? true : false;
     }
     ngOnDestroy() {
         if (this.environmentTypeSubscriber)
@@ -2698,36 +2714,60 @@ class RestService {
     }
     getFeaturedProduct(collectionId) {
         this.getBusinessDetails();
-        let subIndustryId = this.storage.getItem("subIndustryId");
+        let subIndustryId = this.storage.getItem('subIndustryId');
         if (!subIndustryId)
-            subIndustryId = "";
-        return this.http.get(this.BASE_URL + `ecommerce/product/collection/id?collectionId=${collectionId}&isJewellery=${this.isJewellery}`).pipe(map((response) => response.data?.map((product) => new Product(product))));
+            subIndustryId = '';
+        return this.http
+            .get(this.BASE_URL +
+            `ecommerce/product/collection/id?collectionId=${collectionId}&isJewellery=${this.isJewellery}`)
+            .pipe(map((response) => response.data?.map((product) => new Product(product))));
     }
     getCategoriesByCollectionId(collectionId) {
-        return this.http.get(this.BASE_URL + `ecommerce/inventory/category/collectionId?collectionId=${collectionId}`).pipe(map((response) => response.data?.map((category) => new Category(category))));
+        return this.http
+            .get(this.BASE_URL +
+            `ecommerce/inventory/category/collectionId?collectionId=${collectionId}`)
+            .pipe(map((response) => response.data?.map((category) => new Category(category))));
     }
     // https://newdev-api.simpo.ai/
     getAllCategoriesByBusinessId(payload) {
         return this.http.put(this.BASE_URL + `ecommerce/inventory/get/category`, payload);
     }
+    // GET blog/getAll/categories/{businessId} — backend throws "No Categories Found" when empty;
+    // callers should treat that as an empty list, not an error state.
+    getBlogCategories(businessId) {
+        return this.http
+            .get(this.BASE_URL + `business/blog/getAll/categories/${businessId}`)
+            .pipe(map((response) => response.data?.map((category) => new BlogCategory(category)) ??
+            []));
+    }
+    // GET blog/{businessId}/blog-list?businessId={businessId}&categoryId={categoryId}
+    // Note: the path {businessId} segment is unused server-side per the API doc, but must still be
+    // populated identically to the query param — this is the documented URL shape, not a typo.
+    getBlogsByCategory(businessId, categoryId) {
+        return this.http.get(this.BASE_URL +
+            `business/blog/${businessId}/blog-list?businessId=${businessId}&categoryId=${categoryId}`);
+    }
     getPassbookOrderStatus(orderId) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
-        return this.http.post(this.PASSBOOK_URL + `passbook/manual/payment/status?paymentOrderId=${orderId}`, {}, { headers: headers });
+        return this.http.post(this.PASSBOOK_URL +
+            `passbook/manual/payment/status?paymentOrderId=${orderId}`, {}, { headers: headers });
     }
     getProductBySelectedCategory(categoryId) {
         return this.http.get(this.BASE_URL + `ecommerce/product/${categoryId}`);
     }
     getAllSchemes(userId, storeId) {
-        return this.http.get(this.PASSBOOK_URL + `ext/connect/simpo/user?userId=${userId}&storeId=${storeId}`);
+        return this.http.get(this.PASSBOOK_URL +
+            `ext/connect/simpo/user?userId=${userId}&storeId=${storeId}`);
     }
     getAllRedemptionSchemes() {
         return this.http.get(this.orraBaseUrl + `passBook/redemption/amount/check?userCode=C_000313885`);
     }
     getAllProducts(payload) {
-        return this.http.put(this.BASE_URL + `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload);
+        return this.http.put(this.BASE_URL +
+            `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload);
     }
     getProductDetails(productId = null) {
         this.getBusinessDetails();
@@ -2735,11 +2775,14 @@ class RestService {
             pageNo: 0,
             pageSize: 1,
             itemId: productId,
-            subIndustryId: this.storage.getItem("subIndustryId"),
-            userId: this.storage.getItem("perId") ?? null,
-            request: "USER"
+            subIndustryId: this.storage.getItem('subIndustryId'),
+            userId: this.storage.getItem('perId') ?? null,
+            request: 'USER',
         };
-        return this.http.put(this.BASE_URL + `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload).pipe(map((response) => response.data.data.map((product) => new Product(product))));
+        return this.http
+            .put(this.BASE_URL +
+            `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload)
+            .pipe(map((response) => response.data.data.map((product) => new Product(product))));
     }
     getProductDetailsV2(slugName = null) {
         this.getBusinessDetails();
@@ -2747,97 +2790,118 @@ class RestService {
             pageNo: 0,
             pageSize: 1,
             slugifiedName: slugName,
-            subIndustryId: this.storage.getItem("subIndustryId"),
-            businessId: this.storage.getItem("bId") ?? this.storage.getItem("businessId"),
-            userId: this.storage.getItem("perId") ?? null,
-            request: "USER"
+            subIndustryId: this.storage.getItem('subIndustryId'),
+            businessId: this.storage.getItem('bId') ?? this.storage.getItem('businessId'),
+            userId: this.storage.getItem('perId') ?? null,
+            request: 'USER',
         };
-        return this.http.put(this.BASE_URL + `ecommerce/product/itemV2/search?isJewellery=${this.isJewellery}`, payload).pipe(map((response) => response.data.data.map((product) => new Product(product))));
+        return this.http
+            .put(this.BASE_URL +
+            `ecommerce/product/itemV2/search?isJewellery=${this.isJewellery}`, payload)
+            .pipe(map((response) => response.data.data.map((product) => new Product(product))));
     }
     getCollectionByIds(collectionIds) {
         const payload = {
-            ids: collectionIds
+            ids: collectionIds,
         };
-        return this.http.put(this.BASE_URL + `ecommerce/inventory/collection/list/all`, payload).pipe(map((response) => response.data?.map((collection) => new Collection(collection))));
+        return this.http
+            .put(this.BASE_URL + `ecommerce/inventory/collection/list/all`, payload)
+            .pipe(map((response) => response.data?.map((collection) => new Collection(collection))));
     }
     getAllCategories() {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? "";
-        const subIndustryId = this.storage.getItem("subIndustryId") ?? localStorage.getItem("subIndustryId") ?? "";
-        return this.http.get(this.BASE_URL + `ecommerce/inventory/featured?businessId=${businessId}&subId=${subIndustryId}`).pipe(map((response) => response.data?.map((category) => new Category(category))));
+        const businessId = this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? '';
+        const subIndustryId = this.storage.getItem('subIndustryId') ??
+            localStorage.getItem('subIndustryId') ??
+            '';
+        return this.http
+            .get(this.BASE_URL +
+            `ecommerce/inventory/featured?businessId=${businessId}&subId=${subIndustryId}`)
+            .pipe(map((response) => response.data?.map((category) => new Category(category))));
     }
     getAllCollections() {
         const payload = {
             pageNo: 0,
             pageSize: 100,
-            request: "USER",
-            businessId: this.storage.getItem("bId") ?? this.storage.getItem("businessId")
+            request: 'USER',
+            businessId: this.storage.getItem('bId') ?? this.storage.getItem('businessId'),
         };
-        return this.http.put(this.BASE_URL + 'ecommerce/inventory/get/collection', payload).pipe(map((response) => response.data.data?.map((collection) => new Collection(collection))));
+        return this.http
+            .put(this.BASE_URL + 'ecommerce/inventory/get/collection', payload)
+            .pipe(map((response) => response.data.data?.map((collection) => new Collection(collection))));
     }
     getFilteredProduct(collectionIds, categoryIds, searchText, minPrice, maxPrice, minRating, maxRating, sortBy, pageNo, size) {
         this.getBusinessDetails();
         let payload = {
-            "businessId": this.storage.getItem("bId") ?? this.storage.getItem("businessId"),
-            "subIndustryId": this.storage.getItem("subIndustryId"),
-            "collectionId": collectionIds,
-            "categoryId": categoryIds,
-            "searchText": searchText,
-            "sortBy": sortBy,
-            "pageNo": pageNo,
-            "pageSize": size,
-            "userId": this.storage.getItem("perId") ?? null,
-            request: "USER"
+            businessId: this.storage.getItem('bId') ?? this.storage.getItem('businessId'),
+            subIndustryId: this.storage.getItem('subIndustryId'),
+            collectionId: collectionIds,
+            categoryId: categoryIds,
+            searchText: searchText,
+            sortBy: sortBy,
+            pageNo: pageNo,
+            pageSize: size,
+            userId: this.storage.getItem('perId') ?? null,
+            request: 'USER',
         };
         if (minPrice > 0)
-            payload["minPrice"] = minPrice;
+            payload['minPrice'] = minPrice;
         if (maxPrice > 0)
-            payload["maxPrice"] = maxPrice;
+            payload['maxPrice'] = maxPrice;
         if (minRating > 0)
-            payload["minRating"] = minRating;
+            payload['minRating'] = minRating;
         if (maxRating > 0)
-            payload["maxRating"] = maxRating;
-        return this.http.put(this.BASE_URL + `ecommerce/product/itemV2/search?isJewellery=${this.isJewellery}`, payload).pipe(map((response) => {
+            payload['maxRating'] = maxRating;
+        return this.http
+            .put(this.BASE_URL +
+            `ecommerce/product/itemV2/search?isJewellery=${this.isJewellery}`, payload)
+            .pipe(map((response) => {
             return {
                 count: response.data.count,
                 minPrice: response.data.minPrice,
                 maxPrice: response.data.maxPrice,
-                data: response.data.data?.map((product) => new Product(product))
+                data: response.data.data?.map((product) => new Product(product)),
             };
         }));
     }
     getProductByCategoryId(categoryId) {
         this.getBusinessDetails();
         const payload = {
-            "businessId": this.storage.getItem("bId") ?? this.storage.getItem("businessId"),
-            "categoryId": [categoryId],
-            "subIndustryId": this.storage.getItem("subIndustryId"),
-            "pageNo": 0,
-            "pageSize": 10,
-            "userId": this.storage.getItem("perId") ?? null,
-            request: "USER"
+            businessId: this.storage.getItem('bId') ?? this.storage.getItem('businessId'),
+            categoryId: [categoryId],
+            subIndustryId: this.storage.getItem('subIndustryId'),
+            pageNo: 0,
+            pageSize: 10,
+            userId: this.storage.getItem('perId') ?? null,
+            request: 'USER',
         };
-        return this.http.put(this.BASE_URL + `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload).pipe(map((response) => {
+        return this.http
+            .put(this.BASE_URL +
+            `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload)
+            .pipe(map((response) => {
             return {
                 count: response.count,
-                data: response.data.data?.map((product) => new Product(product))
+                data: response.data.data?.map((product) => new Product(product)),
             };
         }));
     }
     getProductByCollectionId(collectionId) {
         this.getBusinessDetails();
         const payload = {
-            "businessId": this.storage.getItem("bId") ?? this.storage.getItem("businessId"),
-            "collectionId": [collectionId],
-            "subIndustryId": this.storage.getItem("subIndustryId"),
-            "pageNo": 0,
-            "pageSize": 10,
-            "userId": this.storage.getItem("perId") ?? null,
-            request: "USER"
+            businessId: this.storage.getItem('bId') ?? this.storage.getItem('businessId'),
+            collectionId: [collectionId],
+            subIndustryId: this.storage.getItem('subIndustryId'),
+            pageNo: 0,
+            pageSize: 10,
+            userId: this.storage.getItem('perId') ?? null,
+            request: 'USER',
         };
-        return this.http.put(this.BASE_URL + `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload).pipe(map((response) => {
+        return this.http
+            .put(this.BASE_URL +
+            `ecommerce/product/item/search?isJewellery=${this.isJewellery}`, payload)
+            .pipe(map((response) => {
             return {
                 count: response.count,
-                data: response.data.data?.map((product) => new Product(product))
+                data: response.data.data?.map((product) => new Product(product)),
             };
         }));
     }
@@ -2848,25 +2912,30 @@ class RestService {
         return this.http.put(this.BASE_URL + `ecommerce/user/filter/reviews?productId=${productId}`, null);
     }
     generateOTP(mobile, countryCode) {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? "";
-        return this.http.post(this.BASE_URL + `ecommerce/user/otp/trigger?mobile=${mobile}&countryCode=${countryCode}&businessId=${businessId}`, null);
+        const businessId = this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? '';
+        return this.http.post(this.BASE_URL +
+            `ecommerce/user/otp/trigger?mobile=${mobile}&countryCode=${countryCode}&businessId=${businessId}`, null);
     }
     verifyOTP(mobile, otp, deviceInfo) {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? "";
-        return this.http.put(this.BASE_URL + `ecommerce/user/authenticate?mobile=${mobile}&otp=${otp}&businessId=${businessId}`, deviceInfo);
+        const businessId = this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? '';
+        return this.http.put(this.BASE_URL +
+            `ecommerce/user/authenticate?mobile=${mobile}&otp=${otp}&businessId=${businessId}`, deviceInfo);
     }
     resendOTP(mobile, countryCode) {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? "";
-        return this.http.post(this.BASE_URL + `ecommerce/user/resend?mobile=${mobile}&countryCode=${countryCode}&businessId=${businessId}`, null);
+        const businessId = this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? '';
+        return this.http.post(this.BASE_URL +
+            `ecommerce/user/resend?mobile=${mobile}&countryCode=${countryCode}&businessId=${businessId}`, null);
     }
     applicableDiscountList(cartId) {
-        return this.http.get(this.BASE_URL + `ecommerce/order/discount-coupon/${cartId}/applicability/list`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/order/discount-coupon/${cartId}/applicability/list`);
     }
     addItemToDB(userCart) {
         return this.http.post(this.BASE_URL + `ecommerce/order/cart`, userCart);
     }
     getUserItems(userId, cartType) {
-        return this.http.get(this.BASE_URL + `ecommerce/order/cart?userId=${userId}&cartType=${cartType}`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/order/cart?userId=${userId}&cartType=${cartType}`);
     }
     getUserInfo(userId) {
         return this.http.put(this.BASE_URL + `ecommerce/user/get/user?userId=${userId}`, null);
@@ -2896,14 +2965,15 @@ class RestService {
         return this.http.post(this.ECOMMERCE_URL + `payment/status`, payloadWithJewellery);
     }
     getRecentViewProduct(userId) {
-        return this.http.post(this.BASE_URL + `ecommerce/user/recentView?userId=${userId}`, null).pipe(map((response) => response.data?.map((product) => new Product(product))));
-        ;
+        return this.http
+            .post(this.BASE_URL + `ecommerce/user/recentView?userId=${userId}`, null)
+            .pipe(map((response) => response.data?.map((product) => new Product(product))));
     }
     sendSignupOTP(payload) {
         return this.http.post(this.BASE_URL + `ecommerce/user/signup/otp/trigger`, payload);
     }
     verifySignupOTP(payload) {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? '';
+        const businessId = this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? '';
         // payload["businessId"] = businessId;
         return this.http.put(this.BASE_URL + `ecommerce/user/authenticate/signup`, payload);
     }
@@ -2911,44 +2981,54 @@ class RestService {
         return this.http.put(this.BASE_URL + `ecommerce/user/authenticate/login`, passData);
     }
     endUserRefferalDetails(userId, referralUniqueId) {
-        return this.http.post(this.BASE_URL + `ecommerce/api/end-user/referralDetails?userId=${userId}&referralUniqueId=${referralUniqueId}`, {});
+        return this.http.post(this.BASE_URL +
+            `ecommerce/api/end-user/referralDetails?userId=${userId}&referralUniqueId=${referralUniqueId}`, {});
     }
     createAppointment(data) {
         return this.http.post(this.BASE_URL + `crm/appointment/add`, data);
     }
     getAllLocation(businessId, size, page) {
-        return this.http.get(this.BASE_URL + `crm/appointment/config/location?businessId=${businessId}&size=${size}&page=${page}`);
+        return this.http.get(this.BASE_URL +
+            `crm/appointment/config/location?businessId=${businessId}&size=${size}&page=${page}`);
     }
     getAllTimeSlots(locationId, date) {
-        return this.http.get(this.BASE_URL + `crm/appointment/config/timeslots?locationId=${locationId}&date=${date}`);
+        return this.http.get(this.BASE_URL +
+            `crm/appointment/config/timeslots?locationId=${locationId}&date=${date}`);
     }
     getAllService(businessId, size, page, locationId) {
         if (!locationId) {
-            return this.http.get(this.BASE_URL + `crm/appointment/config/service?businessId=${businessId}&size=${size}&page=${page}`);
+            return this.http.get(this.BASE_URL +
+                `crm/appointment/config/service?businessId=${businessId}&size=${size}&page=${page}`);
         }
         else {
-            return this.http.get(this.BASE_URL + `crm/appointment/config/service?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}`);
+            return this.http.get(this.BASE_URL +
+                `crm/appointment/config/service?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}`);
         }
     }
     getAllStaffByLocation(businessId, size, page, locationId, serviceId) {
         if (!serviceId) {
-            return this.http.get(this.BASE_URL + `crm/appointment/config/staff?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}`);
+            return this.http.get(this.BASE_URL +
+                `crm/appointment/config/staff?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}`);
         }
         else {
-            return this.http.get(this.BASE_URL + `crm/appointment/config/staff?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}&serviceId=${serviceId}`);
+            return this.http.get(this.BASE_URL +
+                `crm/appointment/config/staff?businessId=${businessId}&size=${size}&page=${page}&locationId=${locationId}&serviceId=${serviceId}`);
         }
     }
     getAvailableSlots(data) {
         return this.http.put(this.BASE_URL + `crm/appointment/config/available/timeslots`, data);
     }
     getSelectedListFields(bId, showInErp, formName) {
-        return this.http.get(this.CMIS_URL + `crm/fields?businessId=${bId}&status=true&showInForm=${showInErp}&isPagination=false&fieldCategory=${formName}`);
+        return this.http.get(this.CMIS_URL +
+            `crm/fields?businessId=${bId}&status=true&showInForm=${showInErp}&isPagination=false&fieldCategory=${formName}`);
     }
     getActiveSubscriptionForFeeStructure(businessId, gradeId) {
-        return this.http.get(this.CMIS_URL + `crm/subscription/plan/list?businessId=${businessId}&gradeId=${gradeId}&status=true&isDeleted=false`);
+        return this.http.get(this.CMIS_URL +
+            `crm/subscription/plan/list?businessId=${businessId}&gradeId=${gradeId}&status=true&isDeleted=false`);
     }
     createAdmission(payload) {
-        return this.http.post(this.CMIS_URL + `crm/registration/admission?registrationId=${payload?.registrationId || ''}`, payload);
+        return this.http.post(this.CMIS_URL +
+            `crm/registration/admission?registrationId=${payload?.registrationId || ''}`, payload);
     }
     createPaymentLink(data) {
         return this.http.post(this.CMIS_URL + `crm/registration/admission/v2/payment?isFromWeb=true`, data);
@@ -2958,7 +3038,8 @@ class RestService {
     }
     getSubscriptionForFeeStructure(gradeId) {
         const businessId = this.storage.getItem('businessId');
-        return this.http.get(this.CMIS_URL + `crm/subscription/plan/list?businessId=${businessId}&gradeId=${gradeId}`);
+        return this.http.get(this.CMIS_URL +
+            `crm/subscription/plan/list?businessId=${businessId}&gradeId=${gradeId}`);
     }
     getFeeStructure(payload) {
         return this.http.put(this.CMIS_URL + `crm/fee/structure`, payload);
@@ -2995,18 +3076,22 @@ class RestService {
         const websiteDataRaw = this.storage.getItem('websiteData');
         const websiteData = this.safeParse(websiteDataRaw);
         // prefer templateId from bDetails; else fallback to websiteData.homePageId
-        const templateId = (details?.templateId ?? websiteData?.homePageId ?? '').toString();
+        const templateId = (details?.templateId ??
+            websiteData?.homePageId ??
+            '').toString();
         return this.http.get(this.BASE_URL + `business/v3/website/${templateId}/pages/list`);
     }
     getEcommerceConfigs() {
-        const businessId = this.storage.getItem('businessId') ?? "1f10651f-9258-6b63-9d23-a3d691aceb88";
+        const businessId = this.storage.getItem('businessId') ??
+            '1f10651f-9258-6b63-9d23-a3d691aceb88';
         return this.http.get(this.BASE_URL + `ecommerce/ecommerce/config/all?businessId=${businessId}`);
     }
     postVideoCallDetails(payload) {
         return this.http.post(this.BASE_URL + `ecommerce/ecommerce/config/video-call`, payload);
     }
     getStoreLocatorDetails(pincode) {
-        return this.http.get(this.BASE_URL + `ecommerce/store/nearby?pincode=${pincode}&businessId=${this.storage.getItem('businessId')}`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/store/nearby?pincode=${pincode}&businessId=${this.storage.getItem('businessId')}`);
     }
     saveImagesToBusinessLibrary(mediaRequest) {
         return this.http.post(this.BASE_URL + `admin/library/image/library/save`, mediaRequest);
@@ -3015,32 +3100,36 @@ class RestService {
         return this.http.post(this.BASE_URL + `admin/content/suggest/v2/website/individual`, request);
     }
     getCategoriesHeaderData() {
-        return this.http.get(this.BASE_URL + `ecommerce/product/${this.storage.getItem('businessId')}/headers`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/product/${this.storage.getItem('businessId')}/headers`);
     }
     getAllStores(payload) {
         let url = '';
         if (payload?.pincode && payload.pincode.toString().length == 6) {
             url = url + ` &pincode=${payload.pincode}`;
         }
-        return this.http.put(this.BASE_URL + `ecommerce/store/get/v2?businessId=${payload.businessId}${url}`, '');
+        return this.http.put(this.BASE_URL +
+            `ecommerce/store/get/v2?businessId=${payload.businessId}${url}`, '');
     }
     getAllAppointmentService(payload) {
         return this.http.put(this.APPOINTMENT_URL + 'service/list', payload);
     }
     getAllStaff(payload) {
-        return this.http.get(this.BASE_URL + `staff/staff/store-staff-list?serviceId=${payload.serviceId}&storeId=${payload.storeId}&businessId=${payload.businessId}`);
+        return this.http.get(this.BASE_URL +
+            `staff/staff/store-staff-list?serviceId=${payload.serviceId}&storeId=${payload.storeId}&businessId=${payload.businessId}`);
     }
     getStoreById(storeId) {
         let payload = {
             storeId: storeId,
-            businessId: this.storage.getItem('businessId') ?? "",
+            businessId: this.storage.getItem('businessId') ?? '',
             pageNo: 0,
-            pageSize: 1000
+            pageSize: 1000,
         };
         return this.http.put(this.BASE_URL + `ecommerce/store/get`, payload);
     }
     postNewsLetter(email) {
-        return this.http.post(this.BASE_URL + `ecommerce/ecommerce/config/registered/newsletter?email=${email}&businessId=${this.storage.getItem('businessId')}`, '');
+        return this.http.post(this.BASE_URL +
+            `ecommerce/ecommerce/config/registered/newsletter?email=${email}&businessId=${this.storage.getItem('businessId')}`, '');
     }
     addReviewToProduct(payload) {
         return this.http.post(this.BASE_URL + `ecommerce/user/add/review?orderId=${payload.orderId}`, payload);
@@ -3081,16 +3170,19 @@ class RestService {
     }
     getHomeAppointmentList(userId) {
         const businessId = this.storage.getItem('bId');
-        return this.http.get(this.BASE_URL + `ecommerce/user/try-home?userId=${userId}&businessId=${businessId}`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/user/try-home?userId=${userId}&businessId=${businessId}`);
     }
     getAllOrraScheme() {
         return this.http.get('https://stageapi-orra.letsmobility.com/passBook/redemption/amount/check?userCode=C_000313885');
     }
     redeemScheme(scheme, cartId, action) {
-        return this.http.post(this.BASE_URL + `ecommerce/order/cart/redemption?cartId=${cartId}&removeScheme=${action}`, scheme);
+        return this.http.post(this.BASE_URL +
+            `ecommerce/order/cart/redemption?cartId=${cartId}&removeScheme=${action}`, scheme);
     }
     getReviewsByProductId(productId, pageNumber) {
-        return this.http.put(this.BASE_URL + `ecommerce/user/filter/reviews?productId=${productId}&pageNumber=${pageNumber}&pageSize=3`, {});
+        return this.http.put(this.BASE_URL +
+            `ecommerce/user/filter/reviews?productId=${productId}&pageNumber=${pageNumber}&pageSize=3`, {});
     }
     getFieldsToDisplay(fieldsList) {
         let map = {};
@@ -3098,7 +3190,9 @@ class RestService {
             for (let fieldGroup of field.fieldGroup) {
                 if (!fieldGroup.fieldStepId)
                     continue;
-                let stepName = fieldGroup.fieldStepName ? fieldGroup.fieldStepName : 'undefined';
+                let stepName = fieldGroup.fieldStepName
+                    ? fieldGroup.fieldStepName
+                    : 'undefined';
                 let groupName = fieldGroup.fieldGroupName;
                 if (!map[stepName]) {
                     map[stepName] = {};
@@ -3136,7 +3230,8 @@ class RestService {
         return this.http.put(this.APPOINTMENT_URL + `booking/group/complete/${groupId}`, {});
     }
     getMyBookings(businessId, userId) {
-        return this.http.get(this.APPOINTMENT_URL + `booking/group/my?businessId=${businessId}&userId=${userId}`);
+        return this.http.get(this.APPOINTMENT_URL +
+            `booking/group/my?businessId=${businessId}&userId=${userId}`);
     }
     getGroupLines(groupId) {
         return this.http.get(this.APPOINTMENT_URL + `booking/group/${groupId}/lines`);
@@ -3146,10 +3241,12 @@ class RestService {
         return this.http.put(this.APPOINTMENT_URL + `booking/group/${groupId}/cancel${query}`, {});
     }
     getCancellationPolicy(businessId) {
-        return this.http.get(this.APPOINTMENT_URL + `policy-masters/${businessId}?policyType=CANCELLATION`);
+        return this.http.get(this.APPOINTMENT_URL +
+            `policy-masters/${businessId}?policyType=CANCELLATION`);
     }
     generateToken(bId, userId) {
-        return this.http.post(this.PASSBOOK_URL + `ext/connect/simpo/token?businessId=${bId}&userId=${userId}&userType=EXTERNAL_USER`, {});
+        return this.http.post(this.PASSBOOK_URL +
+            `ext/connect/simpo/token?businessId=${bId}&userId=${userId}&userType=EXTERNAL_USER`, {});
     }
     getAllEnrolledSchemes(payload) {
         return this.http.put(this.PASSBOOK_URL + 'ext/connect/simpo/scheme/list', payload);
@@ -3157,7 +3254,7 @@ class RestService {
     enrollScheme(payload, checkCharges) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
         if (checkCharges) {
             return this.http.post(this.PASSBOOK_URL + 'passbook/cart/initiate/payment?manualPay=true', payload, { headers: headers });
@@ -3169,19 +3266,22 @@ class RestService {
     getBenefitSlab(passbookId) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
-        return this.http.post(this.PASSBOOK_URL + `passbook/benefit/percentages?passbookId=${passbookId}`, {}, { headers: headers });
+        return this.http.post(this.PASSBOOK_URL +
+            `passbook/benefit/percentages?passbookId=${passbookId}`, {}, { headers: headers });
     }
     getAllStaffList() {
-        return this.http.get(this.BASE_URL + `staff/staff/list/${this.storage.getItem('businessId')}?isPagination=false`);
+        return this.http.get(this.BASE_URL +
+            `staff/staff/list/${this.storage.getItem('businessId')}?isPagination=false`);
     }
     requestRedeemption(passbookId) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
-        return this.http.put(this.PASSBOOK_URL + `passbook/request/redemption?passBookId=${passbookId}`, {}, { headers: headers });
+        return this.http.put(this.PASSBOOK_URL +
+            `passbook/request/redemption?passBookId=${passbookId}`, {}, { headers: headers });
     }
     PassbookAppStatus(bId) {
         return this.http.get(this.BASE_URL + `app/app/check-app?businessId=${bId}&appName=Passbook`);
@@ -3190,7 +3290,8 @@ class RestService {
         return this.http.get(this.BASE_URL + `app/app/check-app?businessId=${bId}&appName=${appName}`);
     }
     getRedeemPoints(bId, userId, evetType, orderValue, rewardPoints) {
-        return this.http.get(this.BASE_URL + `ecommerce/api/referrals/available-amount?businessId=${bId}&userId=${userId}&eventType=${evetType}&orderValue=${orderValue}&rewardPoints=${rewardPoints}`);
+        return this.http.get(this.BASE_URL +
+            `ecommerce/api/referrals/available-amount?businessId=${bId}&userId=${userId}&eventType=${evetType}&orderValue=${orderValue}&rewardPoints=${rewardPoints}`);
     }
     paymentWithCompletePoints(cartId, data) {
         return this.http.post(this.BASE_URL + `ecommerce/order/order/rewards?cartId=${cartId}`, data);
@@ -3198,9 +3299,10 @@ class RestService {
     getAllPassbookDues(bId, userId) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
-        return this.http.get(this.PASSBOOK_URL + `passbook/payment/dues?page=0&size=1000&businessId=${bId}&userId=${userId}`, { headers: headers });
+        return this.http.get(this.PASSBOOK_URL +
+            `passbook/payment/dues?page=0&size=1000&businessId=${bId}&userId=${userId}`, { headers: headers });
     }
     getToken() {
         let token = this.cookieService.get('passBookToken');
@@ -3209,7 +3311,7 @@ class RestService {
     getAllTransactions(payload) {
         const token = this.getToken();
         const headers = new HttpHeaders({
-            'Authorization': `Bearer ${token}`
+            Authorization: `Bearer ${token}`,
         });
         return this.http.put(this.PASSBOOK_URL + `dashboard/v3/transactions/page`, payload, { headers: headers });
     }
@@ -3233,7 +3335,10 @@ class RestService {
      *  Response: { data: { isExistingUser: boolean, message: string } }
      */
     sendOtpV2(identifier, businessId) {
-        return this.http.put(this.BASE_URL + `ecommerce/user/auth/send-otp`, { identifier, businessId });
+        return this.http.put(this.BASE_URL + `ecommerce/user/auth/send-otp`, {
+            identifier,
+            businessId,
+        });
     }
     verifyOtpV2(payload) {
         return this.http.put(this.BASE_URL + `ecommerce/user/auth/verify-otp`, payload);
@@ -3245,12 +3350,16 @@ class RestService {
         return this.http.put(this.BASE_URL + `ecommerce/user/auth/login-password`, payload);
     }
     flush(eventsToSend) {
-        this.http.post(this.BASE_URL + 'ecommerce/analytics/batch', eventsToSend)
+        this.http
+            .post(this.BASE_URL + 'ecommerce/analytics/batch', eventsToSend)
             .subscribe({ error: () => { } });
     }
     getPopularSearches() {
-        const businessId = this.storage.getItem("bId") ?? this.storage.getItem("businessId") ?? "1f121081-dbea-65c6-ad89-1dfe8cdda902";
-        return this.http.get(this.BASE_URL + `ecommerce/inventory/popular-searches?businessId=${businessId}`);
+        const businessId = this.storage.getItem('bId') ??
+            this.storage.getItem('businessId') ??
+            '1f121081-dbea-65c6-ad89-1dfe8cdda902';
+        return this.http.get(this.BASE_URL +
+            `ecommerce/inventory/popular-searches?businessId=${businessId}`);
     }
     getMenuItems(menuId) {
         return this.http.get(this.BASE_URL + `ecommerce/menu/${menuId}`);
@@ -12983,10 +13092,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class BlogListComponent extends BaseSection {
-    constructor(_eventService) {
+    constructor(_eventService, restService, storage) {
         super();
         this._eventService = _eventService;
+        this.restService = restService;
+        this.storage = storage;
         this.responseData = [];
+        this.categoryList = [];
+        // undefined = nothing clicked yet (no tab highlighted); null = "All" explicitly clicked.
+        this.selectedCategoryId = undefined;
+        this.filteredBlogs = null;
+        this.apiLoading = false;
     }
     ngOnInit() {
         for (let blog of this.responseData) {
@@ -12998,6 +13114,53 @@ class BlogListComponent extends BaseSection {
         }
         this.style = this.data?.styles;
         this.blogContent = this.data?.content;
+        this.loadBlogCategories();
+    }
+    get businessId() {
+        return (this.storage.getItem('bId') ?? this.storage.getItem('businessId') ?? null);
+    }
+    get displayedBlogs() {
+        return this.filteredBlogs ?? this.responseData;
+    }
+    loadBlogCategories() {
+        const bId = this.businessId;
+        if (!bId)
+            return;
+        this.restService.getBlogCategories(bId).subscribe({
+            next: categories => {
+                this.categoryList = categories ?? [];
+            },
+            error: () => {
+                this.categoryList = [];
+            },
+        });
+    }
+    selectCategory(categoryId) {
+        this.selectedCategoryId = categoryId;
+        if (categoryId === null) {
+            this.filteredBlogs = null;
+            return;
+        }
+        const bId = this.businessId;
+        if (!bId)
+            return;
+        this.apiLoading = true;
+        this.restService.getBlogsByCategory(bId, categoryId).subscribe({
+            next: (response) => {
+                const list = response?.data ?? [];
+                for (const blog of list) {
+                    blog['img'] = blog.blocks?.find((x) => x.type === 'image')?.data?.file?.url;
+                    if (blog?.keyWords?.content?.length > 0)
+                        blog['tags'] = blog?.keyWords?.content?.split(',') || [];
+                }
+                this.filteredBlogs = list;
+                this.apiLoading = false;
+            },
+            error: () => {
+                this.filteredBlogs = [];
+                this.apiLoading = false;
+            },
+        });
     }
     get headingSpace() {
         return this.style?.layout?.headingSpacing;
@@ -13016,12 +13179,13 @@ class BlogListComponent extends BaseSection {
             this._eventService.editSection.emit({ data: this.data });
         }, 100);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BlogListComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BlogListComponent, isStandalone: true, selector: "simpo-blog-list", inputs: { responseData: "responseData", index: "index", edit: "edit", customClass: "customClass", data: "data", nextComponentColor: "nextComponentColor" }, usesInheritance: true, ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" class=\"total-container\" simpoHover\n  (hovering)=\"showEditTabs($event)\" *ngIf=\"(responseData?.length || 0) > 0;else elseBlock\" [attr.style]=\"customClass\">\n  <div [id]=\"data?.id\" [simpoOverlay]=\"style?.background\" [simpoBorder]=\"style?.border\"\n    [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n    <div class=\"container-fluid\" [spacingHorizontal]=\"stylesLayout\">\n      <div class=\"row gap-20\">\n        <div [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\" *ngFor=\"let content of responseData\"\n          class=\"d-flex\">\n          <a [routerLink]=\"['/blog', content.newPostTitle]\" (click)=\"getBlogById(content.articleSlug)\">\n            <div class=\"cards h-100\" [simpoCorner]=\"style?.corners\" [id]=\"data?.id\">\n              <img loading=\"lazy\" [src]=\"content.img\" [simpoImageDirective]=\"style?.image\" [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\" alt=\"\" *ngIf=\"content.img\" loading=\"lazy\">\n              <img loading=\"lazy\" [simpoImageDirective]=\"style?.image\" [id]=\"data?.id\" [simpoCorner]=\"style?.corners\"\n                src=\"https://dev-beeos.s3.amazonaws.com/library-media/541329c1719236963199pexels-pixabay-262508.jpg\"\n                alt=\"\" *ngIf=\"!content.img\" loading=\"lazy\">\n              <div class=\"p-30\">\n                <!-- <div class=\"d-flex flex-wrap align-items-center gap-2\">\n                  <ng-container *ngFor=\"let tag of content?.tags | slice:0:4\">\n                    <p class=\"mb-0 p-2 border\">{{ tag }}</p>\n                  </ng-container>\n                </div> -->\n                <div class=\"heading-medium title mt-2 fs-20\" *ngIf=\"blogContent?.display?.showHeading\">\n                  {{content.postTitle.length > 100 ? content.postTitle.substring(0,100)+'...\"' : content.postTitle}}\n                  <!-- {{content.postTitle}} -->\n                </div>\n                <ng-container>\n                  <div class=\"body-large mt-4 pb-15\" *ngIf=\"blogContent?.display?.showContent\">\n                    {{ content.postSummary.length > 250 ? content.postSummary.substring(0, 250) + '...' :\n                    content.postSummary }}\n                  </div>\n                </ng-container>\n\n                <div class=\"d-flex justify-content-end p-2 align-items-center\" *ngIf=\"content?.author?.content && content?.author?.content.length > 0\">\n                  <p>- {{content?.author?.content | titlecase}}</p>\n                </div>\n\n                <!-- <div class=\"authors\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                <div>\n                  <mat-icon>person</mat-icon> &nbsp;&nbsp;<span class=\"body-large\">{{content?.author?.content | titlecase}}</span>\n                </div>\n                <div class=\"calendar_today\">\n                  <mat-icon>calendar_today</mat-icon> &nbsp;&nbsp; <span class=\"body-large\">{{content.createdTimeStamp |\n                    date:'EEEE, MMM, d, y'}}</span>\n                </div>\n              </div>\n              <div class=\"button heading-large\" (click)=\"getBlogById(content.newPostTitle)\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                Read More <mat-icon>arrow_right_alt</mat-icon>\n              </div> -->\n              </div>\n            </div>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n  <ng-container *ngIf=\"style?.devider?.display\">\n    <simpo-svg-divider [dividerType]=\"style?.devider?.deviderType\"\n      [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n  </ng-container>\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n  </div>\n</section>\n<ng-template #elseBlock>\n  <div class=\"no-blog-text heading-medium\">Sorry there are no blog posts.</div>\n</ng-template>", styles: [".cards{box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.cards img{width:100%;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.p-30{padding:10px 15px 0}.border{border:1px solid;border-radius:8px}.authors{display:flex;gap:35px;margin-top:40px}.authors div{display:flex}.authors .calendar_today{align-items:center}.authors .calendar_today mat-icon{font-size:20px}.button{font-size:15px;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:interReg;font-weight:500;justify-content:end}.mt-20{margin-top:20px}.total-container{position:relative;height:auto}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.no-blog-text{font-size:24px;line-height:36px;height:40vh;display:flex;align-items:center;justify-content:center}.justify-content-right{justify-content:right}.h-100{height:100%}.gap-20{gap:20px 0px!important}.fs-20{font-size:20px!important}.pb-15{padding-bottom:15px}.ar-none{aspect-ratio:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground", "scrollValue"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ColumnDirectiveDirective, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: SvgDividerComponent, selector: "simpo-svg-divider", inputs: ["dividerType", "color"] }, { kind: "directive", type: SpacingHorizontalDirective, selector: "[spacingHorizontal]", inputs: ["spacingHorizontal", "isHeader"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BlogListComponent, deps: [{ token: EventsService }, { token: RestService }, { token: LOCAL_STORAGE }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BlogListComponent, isStandalone: true, selector: "simpo-blog-list", inputs: { responseData: "responseData", index: "index", edit: "edit", customClass: "customClass", data: "data", nextComponentColor: "nextComponentColor" }, usesInheritance: true, ngImport: i0, template: "<section\n  [id]=\"data?.id\"\n  [simpoBackground]=\"style?.background\"\n  class=\"total-container\"\n  simpoHover\n  (hovering)=\"showEditTabs($event)\"\n  *ngIf=\"\n    categoryList.length > 0 || (displayedBlogs?.length || 0) > 0 || apiLoading;\n    else elseBlock\n  \"\n  [attr.style]=\"customClass\">\n  <div\n    [id]=\"data?.id\"\n    [simpoOverlay]=\"style?.background\"\n    [simpoBorder]=\"style?.border\"\n    [simpoAnimation]=\"style?.animation\"\n    [simpoLayout]=\"style?.layout\">\n    <div class=\"container-fluid\" [spacingHorizontal]=\"stylesLayout\">\n      <div class=\"blog-category-tabs\" *ngIf=\"categoryList.length > 0\">\n        <span\n          class=\"category-tab\"\n          [class.active]=\"selectedCategoryId === null\"\n          (click)=\"selectCategory(null)\"\n          >All</span\n        >\n        <span\n          class=\"category-tab\"\n          *ngFor=\"let category of categoryList\"\n          [class.active]=\"selectedCategoryId === category.id\"\n          (click)=\"selectCategory(category.id)\">\n          {{ category.categoryName }}\n        </span>\n      </div>\n      <simpo-card-skeleton-loader\n        *ngIf=\"apiLoading\"\n        [showTitles]=\"true\"></simpo-card-skeleton-loader>\n      <div\n        class=\"no-blog-text-inline heading-medium\"\n        *ngIf=\"!apiLoading && (displayedBlogs?.length || 0) === 0\">\n        Sorry there are no blog posts in this category.\n      </div>\n      <div\n        class=\"row gap-20\"\n        *ngIf=\"!apiLoading && (displayedBlogs?.length || 0) > 0\">\n        <div\n          [simpoColumnDirective]=\"data?.styles?.size\"\n          [id]=\"data?.id\"\n          *ngFor=\"let content of displayedBlogs\"\n          class=\"d-flex\">\n          <a\n            [routerLink]=\"['/blog', content.newPostTitle]\"\n            (click)=\"getBlogById(content.articleSlug)\">\n            <div\n              class=\"cards h-100\"\n              [simpoCorner]=\"style?.corners\"\n              [id]=\"data?.id\">\n              <img\n                loading=\"lazy\"\n                [src]=\"content.img\"\n                [simpoImageDirective]=\"style?.image\"\n                [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\"\n                alt=\"\"\n                *ngIf=\"content.img\"\n                loading=\"lazy\" />\n              <img\n                loading=\"lazy\"\n                [simpoImageDirective]=\"style?.image\"\n                [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\"\n                src=\"https://dev-beeos.s3.amazonaws.com/library-media/541329c1719236963199pexels-pixabay-262508.jpg\"\n                alt=\"\"\n                *ngIf=\"!content.img\"\n                loading=\"lazy\" />\n              <div class=\"p-30\">\n                <div\n                  class=\"d-flex flex-wrap align-items-center gap-2 mb-2\"\n                  *ngIf=\"content?.tags?.length || content?.categoryName\">\n                  <p class=\"mb-0 p-2 border\" *ngIf=\"content?.categoryName\">\n                    {{ content.categoryName }}\n                  </p>\n                  <ng-container\n                    *ngFor=\"let tag of content?.tags | slice: 0 : 4\">\n                    <p class=\"mb-0 p-2 border\">{{ tag }}</p>\n                  </ng-container>\n                </div>\n                <div\n                  class=\"heading-medium title mt-2 fs-20\"\n                  *ngIf=\"blogContent?.display?.showHeading\">\n                  {{\n                    content.postTitle.length > 100\n                      ? content.postTitle.substring(0, 100) + '...\"'\n                      : content.postTitle\n                  }}\n                  <!-- {{content.postTitle}} -->\n                </div>\n                <ng-container>\n                  <div\n                    class=\"body-large mt-4 pb-15\"\n                    *ngIf=\"blogContent?.display?.showContent\">\n                    {{\n                      content.postSummary.length > 250\n                        ? content.postSummary.substring(0, 250) + '...'\n                        : content.postSummary\n                    }}\n                  </div>\n                </ng-container>\n\n                <div\n                  class=\"d-flex justify-content-end p-2 align-items-center\"\n                  *ngIf=\"\n                    content?.author?.content &&\n                    content?.author?.content.length > 0\n                  \">\n                  <p>- {{ content?.author?.content | titlecase }}</p>\n                </div>\n\n                <!-- <div class=\"authors\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                <div>\n                  <mat-icon>person</mat-icon> &nbsp;&nbsp;<span class=\"body-large\">{{content?.author?.content | titlecase}}</span>\n                </div>\n                <div class=\"calendar_today\">\n                  <mat-icon>calendar_today</mat-icon> &nbsp;&nbsp; <span class=\"body-large\">{{content.createdTimeStamp |\n                    date:'EEEE, MMM, d, y'}}</span>\n                </div>\n              </div>\n              <div class=\"button heading-large\" (click)=\"getBlogById(content.newPostTitle)\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                Read More <mat-icon>arrow_right_alt</mat-icon>\n              </div> -->\n              </div>\n            </div>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n  <ng-container *ngIf=\"style?.devider?.display\">\n    <simpo-svg-divider\n      [dividerType]=\"style?.devider?.deviderType\"\n      [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n  </ng-container>\n  <div [ngClass]=\"{ hover_effect: edit }\" *ngIf=\"showEditors\">\n    <simpo-hover-elements\n      [data]=\"data\"\n      [index]=\"index\"\n      [editOptions]=\"edit\"></simpo-hover-elements>\n  </div>\n</section>\n<ng-template #elseBlock>\n  <div class=\"no-blog-text heading-medium\">Sorry there are no blog posts.</div>\n</ng-template>\n", styles: [".cards{box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.cards img{width:100%;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.p-30{padding:10px 15px 0}.border{border:1px solid;border-radius:8px}.authors{display:flex;gap:35px;margin-top:40px}.authors div{display:flex}.authors .calendar_today{align-items:center}.authors .calendar_today mat-icon{font-size:20px}.button{font-size:15px;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:interReg;font-weight:500;justify-content:end}.mt-20{margin-top:20px}.total-container{position:relative;height:auto}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.no-blog-text{font-size:24px;line-height:36px;height:40vh;display:flex;align-items:center;justify-content:center}.no-blog-text-inline{font-size:18px;padding:60px 0;text-align:center}.justify-content-right{justify-content:right}.h-100{height:100%}.gap-20{gap:20px 0px!important}.fs-20{font-size:20px!important}.pb-15{padding-bottom:15px}.ar-none{aspect-ratio:0!important}.blog-category-tabs{display:flex;flex-wrap:nowrap;align-items:center;gap:32px;overflow-x:auto;border-bottom:1px solid #e5e5e5;padding-bottom:14px;margin-bottom:24px;scrollbar-width:none}.blog-category-tabs::-webkit-scrollbar{display:none}.category-tab{flex-shrink:0;padding-bottom:4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#8a8a8a;white-space:nowrap;cursor:pointer;border-bottom:2px solid transparent}.category-tab:hover,.category-tab.active{color:#1a1a1a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.SlicePipe, name: "slice" }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground", "scrollValue"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ColumnDirectiveDirective, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: SvgDividerComponent, selector: "simpo-svg-divider", inputs: ["dividerType", "color"] }, { kind: "directive", type: SpacingHorizontalDirective, selector: "[spacingHorizontal]", inputs: ["spacingHorizontal", "isHeader"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: CardSkeletonLoaderComponent, selector: "simpo-card-skeleton-loader", inputs: ["count", "showTitles"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BlogListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'simpo-blog-list', standalone: true, imports: [CommonModule,
+            args: [{ selector: 'simpo-blog-list', standalone: true, imports: [
+                        CommonModule,
                         AnimationDirective,
                         BorderDirective,
                         ContentFitDirective,
@@ -13033,9 +13197,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         ContentTitleDirective,
                         HoverDirective,
                         HoverElementsComponent,
-                        MatIcon, SvgDividerComponent,
-                        SpacingHorizontalDirective, RouterLink], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" class=\"total-container\" simpoHover\n  (hovering)=\"showEditTabs($event)\" *ngIf=\"(responseData?.length || 0) > 0;else elseBlock\" [attr.style]=\"customClass\">\n  <div [id]=\"data?.id\" [simpoOverlay]=\"style?.background\" [simpoBorder]=\"style?.border\"\n    [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n    <div class=\"container-fluid\" [spacingHorizontal]=\"stylesLayout\">\n      <div class=\"row gap-20\">\n        <div [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\" *ngFor=\"let content of responseData\"\n          class=\"d-flex\">\n          <a [routerLink]=\"['/blog', content.newPostTitle]\" (click)=\"getBlogById(content.articleSlug)\">\n            <div class=\"cards h-100\" [simpoCorner]=\"style?.corners\" [id]=\"data?.id\">\n              <img loading=\"lazy\" [src]=\"content.img\" [simpoImageDirective]=\"style?.image\" [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\" alt=\"\" *ngIf=\"content.img\" loading=\"lazy\">\n              <img loading=\"lazy\" [simpoImageDirective]=\"style?.image\" [id]=\"data?.id\" [simpoCorner]=\"style?.corners\"\n                src=\"https://dev-beeos.s3.amazonaws.com/library-media/541329c1719236963199pexels-pixabay-262508.jpg\"\n                alt=\"\" *ngIf=\"!content.img\" loading=\"lazy\">\n              <div class=\"p-30\">\n                <!-- <div class=\"d-flex flex-wrap align-items-center gap-2\">\n                  <ng-container *ngFor=\"let tag of content?.tags | slice:0:4\">\n                    <p class=\"mb-0 p-2 border\">{{ tag }}</p>\n                  </ng-container>\n                </div> -->\n                <div class=\"heading-medium title mt-2 fs-20\" *ngIf=\"blogContent?.display?.showHeading\">\n                  {{content.postTitle.length > 100 ? content.postTitle.substring(0,100)+'...\"' : content.postTitle}}\n                  <!-- {{content.postTitle}} -->\n                </div>\n                <ng-container>\n                  <div class=\"body-large mt-4 pb-15\" *ngIf=\"blogContent?.display?.showContent\">\n                    {{ content.postSummary.length > 250 ? content.postSummary.substring(0, 250) + '...' :\n                    content.postSummary }}\n                  </div>\n                </ng-container>\n\n                <div class=\"d-flex justify-content-end p-2 align-items-center\" *ngIf=\"content?.author?.content && content?.author?.content.length > 0\">\n                  <p>- {{content?.author?.content | titlecase}}</p>\n                </div>\n\n                <!-- <div class=\"authors\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                <div>\n                  <mat-icon>person</mat-icon> &nbsp;&nbsp;<span class=\"body-large\">{{content?.author?.content | titlecase}}</span>\n                </div>\n                <div class=\"calendar_today\">\n                  <mat-icon>calendar_today</mat-icon> &nbsp;&nbsp; <span class=\"body-large\">{{content.createdTimeStamp |\n                    date:'EEEE, MMM, d, y'}}</span>\n                </div>\n              </div>\n              <div class=\"button heading-large\" (click)=\"getBlogById(content.newPostTitle)\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                Read More <mat-icon>arrow_right_alt</mat-icon>\n              </div> -->\n              </div>\n            </div>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n  <ng-container *ngIf=\"style?.devider?.display\">\n    <simpo-svg-divider [dividerType]=\"style?.devider?.deviderType\"\n      [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n  </ng-container>\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n  </div>\n</section>\n<ng-template #elseBlock>\n  <div class=\"no-blog-text heading-medium\">Sorry there are no blog posts.</div>\n</ng-template>", styles: [".cards{box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.cards img{width:100%;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.p-30{padding:10px 15px 0}.border{border:1px solid;border-radius:8px}.authors{display:flex;gap:35px;margin-top:40px}.authors div{display:flex}.authors .calendar_today{align-items:center}.authors .calendar_today mat-icon{font-size:20px}.button{font-size:15px;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:interReg;font-weight:500;justify-content:end}.mt-20{margin-top:20px}.total-container{position:relative;height:auto}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.no-blog-text{font-size:24px;line-height:36px;height:40vh;display:flex;align-items:center;justify-content:center}.justify-content-right{justify-content:right}.h-100{height:100%}.gap-20{gap:20px 0px!important}.fs-20{font-size:20px!important}.pb-15{padding-bottom:15px}.ar-none{aspect-ratio:0!important}\n"] }]
-        }], ctorParameters: () => [{ type: EventsService }], propDecorators: { responseData: [{
+                        MatIcon,
+                        SvgDividerComponent,
+                        SpacingHorizontalDirective,
+                        RouterLink,
+                        CardSkeletonLoaderComponent,
+                    ], template: "<section\n  [id]=\"data?.id\"\n  [simpoBackground]=\"style?.background\"\n  class=\"total-container\"\n  simpoHover\n  (hovering)=\"showEditTabs($event)\"\n  *ngIf=\"\n    categoryList.length > 0 || (displayedBlogs?.length || 0) > 0 || apiLoading;\n    else elseBlock\n  \"\n  [attr.style]=\"customClass\">\n  <div\n    [id]=\"data?.id\"\n    [simpoOverlay]=\"style?.background\"\n    [simpoBorder]=\"style?.border\"\n    [simpoAnimation]=\"style?.animation\"\n    [simpoLayout]=\"style?.layout\">\n    <div class=\"container-fluid\" [spacingHorizontal]=\"stylesLayout\">\n      <div class=\"blog-category-tabs\" *ngIf=\"categoryList.length > 0\">\n        <span\n          class=\"category-tab\"\n          [class.active]=\"selectedCategoryId === null\"\n          (click)=\"selectCategory(null)\"\n          >All</span\n        >\n        <span\n          class=\"category-tab\"\n          *ngFor=\"let category of categoryList\"\n          [class.active]=\"selectedCategoryId === category.id\"\n          (click)=\"selectCategory(category.id)\">\n          {{ category.categoryName }}\n        </span>\n      </div>\n      <simpo-card-skeleton-loader\n        *ngIf=\"apiLoading\"\n        [showTitles]=\"true\"></simpo-card-skeleton-loader>\n      <div\n        class=\"no-blog-text-inline heading-medium\"\n        *ngIf=\"!apiLoading && (displayedBlogs?.length || 0) === 0\">\n        Sorry there are no blog posts in this category.\n      </div>\n      <div\n        class=\"row gap-20\"\n        *ngIf=\"!apiLoading && (displayedBlogs?.length || 0) > 0\">\n        <div\n          [simpoColumnDirective]=\"data?.styles?.size\"\n          [id]=\"data?.id\"\n          *ngFor=\"let content of displayedBlogs\"\n          class=\"d-flex\">\n          <a\n            [routerLink]=\"['/blog', content.newPostTitle]\"\n            (click)=\"getBlogById(content.articleSlug)\">\n            <div\n              class=\"cards h-100\"\n              [simpoCorner]=\"style?.corners\"\n              [id]=\"data?.id\">\n              <img\n                loading=\"lazy\"\n                [src]=\"content.img\"\n                [simpoImageDirective]=\"style?.image\"\n                [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\"\n                alt=\"\"\n                *ngIf=\"content.img\"\n                loading=\"lazy\" />\n              <img\n                loading=\"lazy\"\n                [simpoImageDirective]=\"style?.image\"\n                [id]=\"data?.id\"\n                [simpoCorner]=\"style?.corners\"\n                src=\"https://dev-beeos.s3.amazonaws.com/library-media/541329c1719236963199pexels-pixabay-262508.jpg\"\n                alt=\"\"\n                *ngIf=\"!content.img\"\n                loading=\"lazy\" />\n              <div class=\"p-30\">\n                <div\n                  class=\"d-flex flex-wrap align-items-center gap-2 mb-2\"\n                  *ngIf=\"content?.tags?.length || content?.categoryName\">\n                  <p class=\"mb-0 p-2 border\" *ngIf=\"content?.categoryName\">\n                    {{ content.categoryName }}\n                  </p>\n                  <ng-container\n                    *ngFor=\"let tag of content?.tags | slice: 0 : 4\">\n                    <p class=\"mb-0 p-2 border\">{{ tag }}</p>\n                  </ng-container>\n                </div>\n                <div\n                  class=\"heading-medium title mt-2 fs-20\"\n                  *ngIf=\"blogContent?.display?.showHeading\">\n                  {{\n                    content.postTitle.length > 100\n                      ? content.postTitle.substring(0, 100) + '...\"'\n                      : content.postTitle\n                  }}\n                  <!-- {{content.postTitle}} -->\n                </div>\n                <ng-container>\n                  <div\n                    class=\"body-large mt-4 pb-15\"\n                    *ngIf=\"blogContent?.display?.showContent\">\n                    {{\n                      content.postSummary.length > 250\n                        ? content.postSummary.substring(0, 250) + '...'\n                        : content.postSummary\n                    }}\n                  </div>\n                </ng-container>\n\n                <div\n                  class=\"d-flex justify-content-end p-2 align-items-center\"\n                  *ngIf=\"\n                    content?.author?.content &&\n                    content?.author?.content.length > 0\n                  \">\n                  <p>- {{ content?.author?.content | titlecase }}</p>\n                </div>\n\n                <!-- <div class=\"authors\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                <div>\n                  <mat-icon>person</mat-icon> &nbsp;&nbsp;<span class=\"body-large\">{{content?.author?.content | titlecase}}</span>\n                </div>\n                <div class=\"calendar_today\">\n                  <mat-icon>calendar_today</mat-icon> &nbsp;&nbsp; <span class=\"body-large\">{{content.createdTimeStamp |\n                    date:'EEEE, MMM, d, y'}}</span>\n                </div>\n              </div>\n              <div class=\"button heading-large\" (click)=\"getBlogById(content.newPostTitle)\" [ngClass]=\"'justify-content-' + (style?.layout?.align || '')\">\n                Read More <mat-icon>arrow_right_alt</mat-icon>\n              </div> -->\n              </div>\n            </div>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n  <ng-container *ngIf=\"style?.devider?.display\">\n    <simpo-svg-divider\n      [dividerType]=\"style?.devider?.deviderType\"\n      [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n  </ng-container>\n  <div [ngClass]=\"{ hover_effect: edit }\" *ngIf=\"showEditors\">\n    <simpo-hover-elements\n      [data]=\"data\"\n      [index]=\"index\"\n      [editOptions]=\"edit\"></simpo-hover-elements>\n  </div>\n</section>\n<ng-template #elseBlock>\n  <div class=\"no-blog-text heading-medium\">Sorry there are no blog posts.</div>\n</ng-template>\n", styles: [".cards{box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.cards img{width:100%;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.p-30{padding:10px 15px 0}.border{border:1px solid;border-radius:8px}.authors{display:flex;gap:35px;margin-top:40px}.authors div{display:flex}.authors .calendar_today{align-items:center}.authors .calendar_today mat-icon{font-size:20px}.button{font-size:15px;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:interReg;font-weight:500;justify-content:end}.mt-20{margin-top:20px}.total-container{position:relative;height:auto}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.no-blog-text{font-size:24px;line-height:36px;height:40vh;display:flex;align-items:center;justify-content:center}.no-blog-text-inline{font-size:18px;padding:60px 0;text-align:center}.justify-content-right{justify-content:right}.h-100{height:100%}.gap-20{gap:20px 0px!important}.fs-20{font-size:20px!important}.pb-15{padding-bottom:15px}.ar-none{aspect-ratio:0!important}.blog-category-tabs{display:flex;flex-wrap:nowrap;align-items:center;gap:32px;overflow-x:auto;border-bottom:1px solid #e5e5e5;padding-bottom:14px;margin-bottom:24px;scrollbar-width:none}.blog-category-tabs::-webkit-scrollbar{display:none}.category-tab{flex-shrink:0;padding-bottom:4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#8a8a8a;white-space:nowrap;cursor:pointer;border-bottom:2px solid transparent}.category-tab:hover,.category-tab.active{color:#1a1a1a}\n"] }]
+        }], ctorParameters: () => [{ type: EventsService }, { type: RestService }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [LOCAL_STORAGE]
+                }] }], propDecorators: { responseData: [{
                 type: Input
             }], index: [{
                 type: Input
@@ -13050,944 +13221,1300 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class ViewBlogComponent {
-    constructor(_eventService) {
+    constructor(_eventService, _elementRef, platformId) {
         this._eventService = _eventService;
+        this._elementRef = _elementRef;
         this.responseData = {
-            "displayId": "BG1285",
-            "updatedTimeStamp": "2024-12-14T17:04:14.000+00:00",
-            "readTime": "8",
-            "wordCount": 1608,
-            "totalVisits": 0,
-            "id": "1efba3d1-5cac-692c-8486-4505201f8678",
-            "time": 0.0,
-            "version": "",
-            "blocks": [
+            subIndustryId: null,
+            subIndustryName: '',
+            displayId: 'BG1778',
+            articleSlug: 'How-to-Increase-Repeat-Customers-in-a-Jewellery-Store',
+            updatedTimeStamp: '2026-07-22T12:10:20.000+00:00',
+            readTime: '6',
+            wordCount: 1256,
+            totalVisits: 0,
+            id: '1f185c62-898d-67c7-a377-c3e9c2e4f536',
+            businessId: '1ef944db-0e37-6f01-943a-214dd19f54e9',
+            time: 0,
+            version: '',
+            blocks: [
                 {
-                    "id": "6z2AphuRaq",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:16pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">A Complete Guide to the Top 5 Web Development Frameworks for Novices</span>"
-                    }
+                    id: 'JyDKAbiu81',
+                    type: 'header',
+                    data: {
+                        text: 'How to Increase Repeat Customers in a Jewellery Store:&nbsp; Proven Strategies to Boost Customer Loyalty &amp; Sales',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "hEM1ub64il",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Overview</span>"
-                    }
+                    id: 'vkcNOX9tLF',
+                    type: 'image',
+                    data: {
+                        caption: '',
+                        withBorder: false,
+                        withBackground: false,
+                        stretched: false,
+                        file: {
+                            url: 'https://prod-simpo.s3.ap-south-1.amazonaws.com/images/859800c17847214109891.png',
+                            height: '500px',
+                        },
+                    },
                 },
                 {
-                    "id": "OkgSbNjWvv",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">The article's goal</span>"
-                    }
+                    id: 'qd0UQID0VJ',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:17pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Imagine This…</span>',
+                    },
                 },
                 {
-                    "id": "8aLKC67NDP",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Selecting the best framework in the constantly changing field of web development can be difficult, particularly for novices. By outlining the features and advantages of some of the greatest web development frameworks on the market today, this post seeks to assist novices in choosing the one that would best meet their requirements.</span>"
-                    }
+                    id: 'uPNGAY1cB9',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">You spent </span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">₹15,000 on Meta Ads</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">, printed thousands of pamphlets for a festive offer, and even ran a local newspaper advertisement.</span>',
+                    },
                 },
                 {
-                    "id": "Q-lcDNxfID",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;An Overview of Frameworks for Web Development</span>"
-                    }
+                    id: 'bDzXtwyHH9',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Customers walked into your jewellery showroom. Sales were good during Akshaya Tritiya, Diwali, and the wedding season.</span>',
+                    },
                 },
                 {
-                    "id": "wKrSxt4XMV",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Web development frameworks are collections of best practices, libraries, and tools designed to make creating websites and apps easier. They give developers a clear structure and pre-built components to help them create applications more rapidly and effectively.</span>"
-                    }
+                    id: 'dummyTableDemo1',
+                    type: 'table',
+                    data: {
+                        withHeadings: true,
+                        content: [
+                            ['Loyalty Tier', 'Min. Purchase', 'Reward', 'Validity'],
+                            ['Silver', '₹25,000', '2% cashback', '12 months'],
+                            ['Gold', '₹75,000', '5% cashback', '12 months'],
+                            [
+                                'Platinum',
+                                '₹1,50,000',
+                                '8% cashback + free maintenance',
+                                '24 months',
+                            ],
+                        ],
+                    },
                 },
                 {
-                    "id": "3p4EODCtRd",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Relevance for Novices</span>"
-                    }
+                    id: 'dummyTableDemo2',
+                    type: 'table',
+                    data: {
+                        withHeadings: false,
+                        content: [
+                            ['Festive Season', 'Akshaya Tritiya, Diwali, wedding season'],
+                            ['Avg. Repeat Purchase Gap', '8-10 months'],
+                            ['Preferred Contact Channel', 'WhatsApp'],
+                            ['Top Reason For Return Visit', 'Referral rewards'],
+                        ],
+                    },
                 },
                 {
-                    "id": "FjGjIfQupa",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Frameworks are a means for novice web developers to avoid writing the same code over and over again. They also assist in resolving some of the most common issues, allowing one to concentrate on learning and improving his abilities rather than making a new discovery.</span>"
-                    }
+                    id: 'dummyTableDemo3',
+                    type: 'table',
+                    data: {
+                        withHeadings: true,
+                        content: [
+                            [
+                                'Month',
+                                'New Customers',
+                                'Repeat Customers',
+                                'WhatsApp Reminders Sent',
+                                'Redemptions',
+                                'Revenue from Repeats',
+                            ],
+                            ['April', '120', '45', '300', '60', '₹4,20,000'],
+                            ['May', '98', '62', '340', '78', '₹5,10,000'],
+                            ['June', '145', '80', '410', '95', '₹6,35,000'],
+                        ],
+                    },
                 },
                 {
-                    "id": "CRdm6fFkP2",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;The intended audience</span>"
-                    }
+                    id: 'fadoWe1GBc',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">But after six months, something unexpected happened.</span>',
+                    },
                 },
                 {
-                    "id": "aLUXXN6bCi",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;This course is perfect for:&nbsp;</span>"
-                    }
+                    id: 'L367jCincd',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The same customers who once praised your service bought their next jewellery purchase from another store.</span>',
+                    },
                 },
                 {
-                    "id": "UO06Fqzbdy",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">● Novice web developers who wish to begin their careers</span>"
-                    }
+                    id: 'dkLsmSu2lY',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Not because your jewellery was expensive.</span>',
+                    },
                 },
                 {
-                    "id": "1fSaoLtmFI",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">● Students and hobbyists who wish to learn web development as a pastime or career.</span>"
-                    }
+                    id: 'DAdq8GtPbR',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Not because your designs were outdated.</span>',
+                    },
                 },
                 {
-                    "id": "4KIezvDnLX",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">An overview of the article</span>"
-                    }
+                    id: '9pqofrbOW0',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">But because </span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">they simply forgot about your business.</span>',
+                    },
                 },
                 {
-                    "id": "29dySrByJF",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Each framework will be covered in the manner described below:</span>"
-                    }
+                    id: 'IE9A-uBWBg',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">This is one of the biggest challenges jewellery retailers face today.</span>',
+                    },
                 },
                 {
-                    "id": "WEWoWWlvj2",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;A synopsis of the framework and its background&nbsp;</span>"
-                    }
+                    id: 'MF3K4P54FE',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Most jewellery owners spend thousands of rupees attracting new customers while unintentionally neglecting the customers who have already trusted them.</span>',
+                    },
                 },
                 {
-                    "id": "VatZ_RsLjy",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">● Benefits for novices&nbsp;</span>"
-                    }
+                    id: 's_Na0psxmH',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The result?</span>',
+                    },
                 },
                 {
-                    "id": "ICP_OEcFRo",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">● Educational materials and advice on how to get started</span>"
-                    }
+                    id: 'FeKyQmpgXr',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Customers purchase once and never return.',
+                            'Gold scheme members stop paying monthly instalments.',
+                            'Staff spend hours making reminder calls.',
+                            'Customer records remain in paper files or Excel sheets.',
+                            'Festival campaigns reach only a fraction of past buyers.',
+                            'Competitors reconnect with your customers before you do.',
+                        ],
+                    },
                 },
                 {
-                    "id": "6FqPF85-1S",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;1. React 1.1 React Overview</span>"
-                    }
+                    id: 'zVORjT8DOu',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">If this sounds familiar, you\'re not alone.</span>',
+                    },
                 },
                 {
-                    "id": "n5FQGCCR1U",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">React: What is it?</span>"
-                    }
+                    id: 'oHBeq3cDjH',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The good news is that increasing repeat customers doesn\'t always require a bigger marketing budget.</span>',
+                    },
                 },
                 {
-                    "id": "k_Vb466Z4h",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;A popular JavaScript package for creating user interfaces, particularly for single-page apps, is called React. It lets programmers make massive web apps that can update data without requiring a page reload.</span>"
-                    }
+                    id: 'xbhYCptZpM',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Often, it requires a better customer retention strategy.</span>',
+                    },
                 },
                 {
-                    "id": "GJjjiQIHD0",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;A Synopsis of Development and History</span>"
-                    }
+                    id: '8jTf7G2zLd',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">In this guide, we\'ll explore practical strategies that leading jewellery retailers use to increase customer loyalty, improve gold scheme collections, and build a business where customers keep coming back year after year.</span>',
+                    },
                 },
                 {
-                    "id": "J8rdZylegP",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Facebook created React in 2013 to improve the speed and usability of creating intricate user interfaces. It is run by Facebook and has a large community. It has become incredibly popular.</span>"
-                    }
+                    id: 'uNUXVV2HAF',
+                    type: 'header',
+                    data: {
+                        text: 'Why Repeat Customers Matter More Than New Customers',
+                        level: 1,
+                    },
                 },
                 {
-                    "id": "srRVuEHgua",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;React Virtual DOM's salient features include: Because React will just render the modified content, this is what improves performance.</span>"
-                    }
+                    id: 'AraiFCgo1I',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Every jewellery retailer dreams of attracting new customers.</span>',
+                    },
                 },
                 {
-                    "id": "WzHtZP0vvp",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Component-Based Architecture: It facilitates easier maintenance and reuse.</span>"
-                    }
+                    id: '11DHzXNNRT',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">But the most profitable stores know a simple truth:</span>',
+                    },
                 },
                 {
-                    "id": "vZh0fzzfqm",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;1.2 Advantages of React for Novices</span>"
-                    }
+                    id: 'W0A0GxNHS7',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The easiest customer to sell to is someone who has already bought from you.</span>',
+                    },
                 },
                 {
-                    "id": "RwxYz5qsXk",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Architecture Based on Components: Beginners may more easily break down their applications into smaller pieces with React.</span>"
-                    }
+                    id: 'KajmNOsrms',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Think about a typical jewellery customer.</span>',
+                    },
                 },
                 {
-                    "id": "93V-qnE525",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Big Ecosystem and Community: React is used by millions of developers, and there is a wealth of third-party tools, forums, and lesson content available.</span>"
-                    }
+                    id: 'XIPJk8oGd5',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">A person buying an engagement ring today might later purchase:</span>',
+                    },
                 },
                 {
-                    "id": "bhy5WMnYGr",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Comprehensive Resources and Documentation: The people who manage the official tool have produced several very good resources, particularly for new users, including:</span>"
-                    }
+                    id: '6udc4_lhcx',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Wedding jewellery',
+                            'Anniversary gifts',
+                            'Baby shower jewellery',
+                            'Festival collections',
+                            'Gold coins',
+                            'Monthly gold savings schemes',
+                        ],
+                    },
                 },
                 {
-                    "id": "p5bJkb8cGl",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;1.3 The Learning Curve</span>"
-                    }
+                    id: '5KjzrI2UnH',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Over a lifetime, one customer can generate multiple purchases.</span>',
+                    },
                 },
                 {
-                    "id": "N9eT_cKnZ5",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Beginners' First Steepness</span>"
-                    }
+                    id: '3XzZwU5W7z',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The challenge is staying connected between those occasions.</span>',
+                    },
                 },
                 {
-                    "id": "R9HmsqyUy5",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;But even with its simplicity, JSX, its components, and its lifecycle can be confusing.</span>"
-                    }
+                    id: 'AdmnsV9cTl',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Unfortunately, many jewellery stores lose touch after the first sale.</span>',
+                    },
                 },
                 {
-                    "id": "P-3HWcz7DB",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Learning Resources and Tutorials Available</span>"
-                    }
+                    id: 'PEDGnjTgfV',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No follow-up.</span>',
+                    },
                 },
                 {
-                    "id": "jkYgAUOe5S",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;● The official React documentation is the ideal starting point.&nbsp;</span>"
-                    }
+                    id: 'E1n0EGLScQ',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No reminders.</span>',
+                    },
                 },
                 {
-                    "id": "jMYvQRJIXZ",
-                    "type": "list",
-                    "data": {
-                        "style": "unordered",
-                        "items": [
-                            "Both Codecademy and freeCodeCamp provide beginner courses."
-                        ]
-                    }
+                    id: '9mqQlu_m94',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No personalized communication.</span>',
+                    },
                 },
                 {
-                    "id": "NGr8G8BF29",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Usability in Relation to Other Frameworks</span>"
-                    }
+                    id: 'faQUMozk8E',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No loyalty program.</span>',
+                    },
                 },
                 {
-                    "id": "6_0pCELwKP",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;React is particularly popular with new users since it has a less steep learning curve than Angular.</span>"
-                    }
+                    id: '95FLH2Z5fH',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Eventually, the customer walks into another jewellery store—not because they\'re unhappy, but because the competitor stayed visible.</span>',
+                    },
                 },
                 {
-                    "id": "psn72vsGsf",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;2. The Vue.js</span>"
-                    }
+                    id: 'qHDfLo4bPA',
+                    type: 'header',
+                    data: {
+                        text: 'The Biggest Customer Retention Problems Jewellery Stores Face',
+                        level: 1,
+                    },
                 },
                 {
-                    "id": "xT13vElMbW",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">2.1 Overview of the Framework Vue.js</span>"
-                    }
+                    id: '5VDm7sUJte',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">After speaking with jewellery retailers across India, the same challenges appear repeatedly.</span>',
+                    },
                 },
                 {
-                    "id": "L49yNPlfXV",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;A progressive JavaScript framework for creating user interfaces and single-page apps is called Vue.js.</span>"
-                    }
+                    id: 'ee1avurVhp',
+                    type: 'header',
+                    data: {
+                        text: '1. Customers Forget About the Store',
+                        level: 3,
+                    },
                 },
                 {
-                    "id": "soXo-6ypFq",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Fundamental Ideas of Vue.js</span>"
-                    }
+                    id: 'MXpJGVcIu1',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Most customers buy jewellery only a few times a year.</span>',
+                    },
                 },
                 {
-                    "id": "9RjPayjPtg",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;It emphasizes adaptability and simplicity, which developers may progressively incorporate into their current projects.</span>"
-                    }
+                    id: 'Wd6TbM8kiP',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Without regular communication, they forget where they purchased last.</span>',
+                    },
                 },
                 {
-                    "id": "5CIhGysy3P",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Comparing Angular with React</span>"
-                    }
+                    id: 'gVktfSScPB',
+                    type: 'header',
+                    data: {
+                        text: '2. Gold Scheme Customers Miss Installments',
+                        level: 3,
+                    },
                 },
                 {
-                    "id": "3oFFZ49nDu",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Compared to React and Angular, Vue is praised for being easier to integrate, making it a more gradual introduction for novices.</span>"
-                    }
+                    id: 'pfErs56YIa',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Monthly gold savings schemes are excellent for customer retention.</span>',
+                    },
                 },
                 {
-                    "id": "Kx2RhGANZQ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;2.2 Advantages for Novice Developers</span>"
-                    }
+                    id: 'sATc0rb9-x',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">However, many customers miss instalments simply because they forget the due date.</span>',
+                    },
                 },
                 {
-                    "id": "42_Ii7x6oN",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Basic Design and Syntax: New developers may easily and quickly learn the syntax of Vue.</span>"
-                    }
+                    id: 'RWNT1tQ_OV',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Staff then spend hours making reminder calls.</span>',
+                    },
                 },
                 {
-                    "id": "ecx1UsJm1L",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Lightweight Framework: This improves user experience by ensuring that the page loads quickly.</span>"
-                    }
+                    id: '-s9MZhQNmg',
+                    type: 'header',
+                    data: {
+                        text: '3. Everything Is Managed Manually',
+                        level: 3,
+                    },
                 },
                 {
-                    "id": "KniDdRn7Li",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Flexibility and Scalability Options: Vue works well for small projects as well as larger ones.</span>"
-                    }
+                    id: '-DWy8vU25_',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Many retailers still depend on:</span>',
+                    },
                 },
                 {
-                    "id": "UUqevHV7TS",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;2.3 Vue Learning Resources.Official Documentation for JSON:&nbsp;</span>"
-                    }
+                    id: 'PQTOI6py5T',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Paper passbooks',
+                            'Excel sheets',
+                            'Registers',
+                            'Manual calculations',
+                        ],
+                    },
                 },
                 {
-                    "id": "b6r1UFYVmc",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">It is thorough and highly beginner-friendly.</span>"
-                    }
+                    id: 'B7hdll3Cvd',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">This increases errors and consumes valuable staff time.</span>',
+                    },
                 },
                 {
-                    "id": "WoXEmQPNJT",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Suggested Basic Courses:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> Websites such as Coursera and Udemy offer structured learning pathways.</span>"
-                    }
+                    id: '7SINkRpmJZ',
+                    type: 'header',
+                    data: {
+                        text: '4. No Customer Database',
+                        level: 3,
+                    },
                 },
                 {
-                    "id": "Bql0i0LJnr",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Support and Community Forums:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> Stack Overflow and other forums are good places to connect with Vue's friendly community.</span>"
-                    }
+                    id: '_d4DGhIKDp',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Many stores have thousands of invoices but no structured customer database.</span>',
+                    },
                 },
                 {
-                    "id": "RVh3cX2L2m",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;3. Angular</span>"
-                    }
+                    id: 'wI62cQ2pbB',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Without customer information, personalized marketing becomes impossible.</span>',
+                    },
                 },
                 {
-                    "id": "BZ14DeKTKj",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;3.1 An Overview of Angular</span>"
-                    }
+                    id: 'vbQEMA4Ofn',
+                    type: 'header',
+                    data: {
+                        text: '5. No Follow-Up Process',
+                        level: 3,
+                    },
                 },
                 {
-                    "id": "rZsUY9TS0e",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">The Angular Framework explained</span>"
-                    }
+                    id: 'M60hLTKwgd',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">After the purchase, communication stops.</span>',
+                    },
                 },
                 {
-                    "id": "q1rzjU1WO6",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Angular is a framework and platform for creating HTML and TypeScript-based single-page client applications.</span>"
-                    }
+                    id: '--inklHM2v',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No birthday wishes.</span>',
+                    },
                 },
                 {
-                    "id": "qhPwzbQNPK",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Key characteristics of angular two-way data binding include: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">simplifying the model-view synchronization procedure.</span>"
-                    }
+                    id: 'ELwVErRFlz',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No anniversary messages.</span>',
+                    },
                 },
                 {
-                    "id": "1beOsXKlgq",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Injection of Dependency:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> Angular's integrated dependency system improves modularity.</span>"
-                    }
+                    id: 'JBQAOZ2gqS',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No festive greetings.</span>',
+                    },
                 },
                 {
-                    "id": "gLuAX7Gclz",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Its Development History.</span>"
-                    }
+                    id: '75hJyzS12C',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">No product recommendations.</span>',
+                    },
                 },
                 {
-                    "id": "VBTmM6Bqgt",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">It was first created by Google in 2010. Since then, Angular has undergone significant changes to rank among web developers' top options.</span>"
-                    }
+                    id: 'th4EM_Ev9x',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The relationship quietly fades away.</span>',
+                    },
                 },
                 {
-                    "id": "WCRkowdWCL",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;3.2 As a Novice, Why Pick Angular?</span>"
-                    }
+                    id: '6LcE7ECdcg',
+                    type: 'header',
+                    data: {
+                        text: '15 Proven Strategies to Increase Repeat Customers',
+                        level: 1,
+                    },
                 },
                 {
-                    "id": "gaS6Yt11oe",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;You don't need to know a lot of libraries because Angular provides everything you need to create a web application.</span>"
-                    }
+                    id: 'Nx632lI-wF',
+                    type: 'header',
+                    data: {
+                        text: '1. Launch a Gold Savings Scheme That Keeps Customers Engaged',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "eGUVhGboCL",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Strongly typed with TypeScript:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> even if it gets more complicated, knowing TypeScript could help you advance as an engineer.</span>"
-                    }
+                    id: 'J_ADpweVfi',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">One of the smartest ways to increase repeat business is through a well-managed </span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Gold Saving Scheme</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">.</span>',
+                    },
                 },
                 {
-                    "id": "hXXe00D_dr",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Real-time updates and two-way data binding ensure smooth and simple data administration.</span>"
-                    }
+                    id: 'S5uj000jqa',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Instead of waiting for customers to return once a year, a gold scheme encourages monthly interaction with your brand.</span>',
+                    },
                 },
                 {
-                    "id": "GySevVEO3P",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;3.3 How to Begin Using Angular</span>"
-                    }
+                    id: 'xBrGqoTLrv',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Every monthly payment becomes another touchpoint.</span>',
+                    },
                 },
                 {
-                    "id": "8QM95ySPbk",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Instructions for Setting Up</span>"
-                    }
+                    id: 'abNB9cO1Zj',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Customers stay connected.</span>',
+                    },
                 },
                 {
-                    "id": "klSo7wB7Qt",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;For installation, you will need Angular CLI and Node.js. Using the official guide can simplify things.</span>"
-                    }
+                    id: 'GLXBsIgN4m',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Trust grows.</span>',
+                    },
                 },
                 {
-                    "id": "2v4N4jeIDU",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Educational Materials</span>"
-                    }
+                    id: 'e3goTGwKrT',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Future purchases become more likely.</span>',
+                    },
                 },
                 {
-                    "id": "Tj6ghSK5am",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;For novices, the official Angular documentation is helpful.</span>"
-                    }
+                    id: 'yOqzBaTH7B',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">However, running a gold scheme manually often creates challenges such as missed instalments, paperwork, and customer confusion.</span>',
+                    },
                 },
                 {
-                    "id": "GXxhUPQOiK",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;YouTube channels and online tutorials offer video support.</span>"
-                    }
+                    id: '1md_1VRYTX',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">This is why many retailers are moving to digital gold scheme management.</span>',
+                    },
                 },
                 {
-                    "id": "lD2ns5RdG1",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Typical Errors to Avoid as a Novice</span>"
-                    }
+                    id: 'JYY8zbXkxh',
+                    type: 'header',
+                    data: {
+                        text: '2. Stop Calling Customers Manually',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "OeYuutbVvY",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Avoid ignoring TypeScript's foundational ideas since they will speed up your learning of Angular.</span>"
-                    }
+                    id: 'V-dw1da3Vl',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Imagine managing 1,200 active gold scheme members.</span>',
+                    },
                 },
                 {
-                    "id": "MhYPzCCTl7",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;4. Django</span>"
-                    }
+                    id: 'hUF1vDzoQX',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Calling every customer every month is almost impossible.</span>',
+                    },
                 },
                 {
-                    "id": "sjx8OS39B8",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;4.1 Overview of Django</span>"
-                    }
+                    id: 'icwpJONCvF',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Instead, automate:</span>',
+                    },
                 },
                 {
-                    "id": "Ek6Tq0ZB_c",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Overview of the Web Framework Django</span>"
-                    }
+                    id: 'T_-ge3rEmM',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Payment reminders',
+                            'Due date alerts',
+                            'Festival greetings',
+                            'Gold rate updates',
+                            'New collection announcements',
+                        ],
+                    },
                 },
                 {
-                    "id": "y1K9pPfGzk",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;A high-level Python web framework called Django promotes quick development and simple, straightforward design.</span>"
-                    }
+                    id: 'GiVE5WcouE',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Automated WhatsApp reminders ensure customers stay informed while allowing your staff to focus on sales rather than repetitive follow-up calls.</span>',
+                    },
                 },
                 {
-                    "id": "RMyUvKc24F",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Important Concepts (DRY, ORM, etc.)</span>"
-                    }
+                    id: '19I6Ja1L5B',
+                    type: 'header',
+                    data: {
+                        text: '3. Replace Paper Passbooks with Digital Passbooks',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "95pf_ytY6Q",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Django adheres to the \"Don't Repeat Yourself\" (DRY) concept, which advocates for code reuse. Database management has been greatly simplified by its ORM.</span>"
-                    }
+                    id: '1MvUvFnBBY',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">One of the most common complaints jewellery retailers hear is:</span>',
+                    },
                 },
                 {
-                    "id": "9cCS8KT9_x",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;When to utilize Django</span>"
-                    }
+                    id: 'LjZ9E-2MT6',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:italic;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">"I\'ve lost my passbook."</span>',
+                    },
                 },
                 {
-                    "id": "0b0cfLM1Ie",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Select Django for the rapid construction of complex online applications, such as social media platforms and content management systems.</span>"
-                    }
+                    id: 'wkbiyMWRVq',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Now your staff spends valuable time searching through records.</span>',
+                    },
                 },
                 {
-                    "id": "AiFVFqfdE_",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">4.2 Benefits of Django for Novices</span>"
-                    }
+                    id: '0oFKoXyH18',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">A digital passbook eliminates this problem.</span>',
+                    },
                 },
                 {
-                    "id": "cwSyfMSYnT",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Quick Development Skills: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">You can create applications quickly thanks to a number of built-in capabilities.</span>"
-                    }
+                    id: 'Ka3ilpF4J0',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Customers can instantly view:</span>',
+                    },
                 },
                 {
-                    "id": "RComdVUvy8",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Integrated Admin Panel: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">A useful tool for managing application data without the need for further coding.</span>"
-                    }
+                    id: 'Q5qeRog7bp',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Instalment history',
+                            'Payment status',
+                            'Remaining balance',
+                            'Scheme progress',
+                        ],
+                    },
                 },
                 {
-                    "id": "0RK7Flimc1",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Robust Security Features: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Django upholds sound security procedures, which may reassure more junior developers.</span>"
-                    }
+                    id: 'L7nZOmQnSg',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">It also builds transparency and confidence.</span>',
+                    },
                 },
                 {
-                    "id": "m5LNICKEez",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;4.3 Resources for Learning the Official Django Documentation and Tutorials: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">An ideal place for any developer to start.</span>"
-                    }
+                    id: 'y0pj6TvTtZ',
+                    type: 'header',
+                    data: {
+                        text: '4. Build a Customer Database, Not Just a Billing Database',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "JSrudPFcaO",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Django-Specific Online Courses: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Courses on websites such as Coursera and Udemy are highly structured.</span>"
-                    }
+                    id: 'jj1Nls6VFv',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Many retailers have years of invoices but very little usable customer information.</span>',
+                    },
                 },
                 {
-                    "id": "RmeuyOXYfl",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Community and Support Resources: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">The Django community, particularly on Reddit and other sites, is friendly and willing to help.</span>"
-                    }
+                    id: 'ze4wFv2xpu',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">A complete customer profile should include:</span>',
+                    },
                 },
                 {
-                    "id": "N9kHvi68Sl",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;5. The flask</span>"
-                    }
+                    id: '_HQ-XU8xyU',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Birthday',
+                            'Anniversary',
+                            'Purchase history',
+                            'Preferred jewellery category',
+                            'Gold scheme status',
+                            'Visit history',
+                        ],
+                    },
                 },
                 {
-                    "id": "0epcv2bQc-",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;5.1 Overview of Flask</span>"
-                    }
+                    id: '526IaO8rZg',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">This enables personalized communication that feels relevant instead of generic.</span>',
+                    },
                 },
                 {
-                    "id": "Jy-5pwTvCR",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">An explanation of the Flask Framework</span>"
-                    }
+                    id: 'HTc9WUGYbQ',
+                    type: 'header',
+                    data: {
+                        text: '5. Make WhatsApp Your Strongest Marketing Channel',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "S-WNQo0YGa",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Flask is a lightweight, straightforward Python microweb framework.</span>"
-                    }
+                    id: 'd6s5rP32z8',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Your customers already use WhatsApp every day.</span>',
+                    },
                 },
                 {
-                    "id": "sb5DyFDBlK",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Comparing Django</span>"
-                    }
+                    id: 'aZzSRfbV2I',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Instead of relying only on social media, communicate through the platform they check most often.</span>',
+                    },
                 },
                 {
-                    "id": "uxFsjDiGwe",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Django is a complete framework, however Flask allows you to select your components more freely.</span>"
-                    }
+                    id: 'KeFelhxn4l',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Examples include:</span>',
+                    },
                 },
                 {
-                    "id": "ujwGMDrqFN",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Fundamental Flask Routing Features: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Applications' responses to web requests are easily controllable.</span>"
-                    }
+                    id: 'nnLkPLK_Gm',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Monthly gold scheme reminders',
+                            'Festival wishes',
+                            'New arrivals',
+                            'Bridal collections',
+                            'Gold rate updates',
+                            'Exclusive offers',
+                        ],
+                    },
                 },
                 {
-                    "id": "ayqy1gLAmt",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Templating:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> It makes use of the user-friendly and adaptable Jinja2 framework.</span>"
-                    }
+                    id: 'fogDf4PfgP',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Consistent communication keeps your store top of mind.</span>',
+                    },
                 },
                 {
-                    "id": "2BM3aUImT_",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">5.2 The Reason Flask Is Novice Amiable</span>"
-                    }
+                    id: 'Tf04Utqhp4',
+                    type: 'header',
+                    data: {
+                        text: '6. Reward Loyalty, Not Just New Customers',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "ynBDuveBCZ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Simplicity and Minimalism:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> Because it is lightweight, there is less initial complexity.</span>"
-                    }
+                    id: '8x3-lLpWuS',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Many jewellery businesses offer discounts only to attract new buyers.</span>',
+                    },
                 },
                 {
-                    "id": "kUOJBjnB6_",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Adaptability in Component Selection: </span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Learning will be more efficient if you only select the resources you require.</span>"
-                    }
+                    id: 'GW-gifTTF8',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Instead, reward customers who continue choosing your brand.</span>',
+                    },
                 },
                 {
-                    "id": "AOVaOTxCxq",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Installation and Setup Ease:</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\"> Just a few commands are needed to get going.</span>"
-                    }
+                    id: '8Jk9fRWsJ3',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Ideas include:</span>',
+                    },
                 },
                 {
-                    "id": "CA-8e21K6c",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;5.3 Introduction to Flask</span>"
-                    }
+                    id: 'OZIeXOHvnM',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Bonus gold after completing a scheme',
+                            'Loyalty rewards',
+                            'Referral incentives',
+                            'Exclusive previews',
+                            'Complimentary jewellery cleaning',
+                        ],
+                    },
                 },
                 {
-                    "id": "4vdJYqlnjk",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Suggested Software and Tools</span>"
-                    }
+                    id: 'wWYtCpA3Wr',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">These small gestures encourage long-term relationships.</span>',
+                    },
                 },
                 {
-                    "id": "OHMpNWDAg2",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Actually, all you'll need to start programming locally is Flask and Python.</span>"
-                    }
+                    id: 'ZfPjEsrvKM',
+                    type: 'header',
+                    data: {
+                        text: "7. Recover Customers Before They're Lost",
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "IRKn7EowfW",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Excellent Flask Instructions for Novices</span>"
-                    }
+                    id: 'CaSeL7KD8q',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Not every inactive customer is gone forever.</span>',
+                    },
                 },
                 {
-                    "id": "W2ZncQ8izQ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;There are many useful examples in the official Flask documentation, which is a wonderful place to start.</span>"
-                    }
+                    id: '5mzmqjmKwM',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Identify customers who haven\'t visited in the last 6–12 months and reconnect them with:</span>',
+                    },
                 },
                 {
-                    "id": "BAUD9Ibjta",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Many of the YouTube videos that are available are quite helpful.</span>"
-                    }
+                    id: 'VeT4U-9auh',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Personalized WhatsApp messages',
+                            'Festival invitations',
+                            'Gold scheme offers',
+                            'New collection previews',
+                        ],
+                    },
                 },
                 {
-                    "id": "GVbGwbQKhQ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Beneficial Forums and Communities</span>"
-                    }
+                    id: 'ru3MnsQ27U',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Winning back an existing customer is usually easier than finding a new one.</span>',
+                    },
                 },
                 {
-                    "id": "vTDH6RUYuh",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;The wonderful community of Flask truly flourishes on support. For guidance, consult Stack Overflow and Reddit.</span>"
-                    }
+                    id: '7gpH_wPDHs',
+                    type: 'header',
+                    data: {
+                        text: '8. Use Technology to Stay Organized',
+                        level: 2,
+                    },
                 },
                 {
-                    "id": "HQlnu8W8zQ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;In conclusion</span>"
-                    }
+                    id: 'qVQurPoeJ8',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">As your customer base grows, spreadsheets and paper registers become difficult to manage.</span>',
+                    },
                 },
                 {
-                    "id": "UCEKXjOweb",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;An overview of the frameworks</span>"
-                    }
+                    id: 'vbtKHxUnzC',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">A digital platform such as </span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">PassbookApp</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> helps jewellery retailers:</span>',
+                    },
                 },
                 {
-                    "id": "hX3DDv9m2s",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;In conclusion, we discussed five excellent frameworks: Flask, Django, Angular, Vue.js, and React. Each of them has advantages and can serve as a solid foundation for your web development endeavors.</span>"
-                    }
+                    id: 'N5QzSekQgD',
+                    type: 'list',
+                    data: {
+                        style: 'unordered',
+                        items: [
+                            'Manage gold savings schemes',
+                            'Track customer payments',
+                            'Send automated WhatsApp reminders',
+                            'Maintain digital passbooks',
+                            'Build customer profiles',
+                            'Monitor collections from one dashboard',
+                        ],
+                    },
                 },
                 {
-                    "id": "R-luOykisv",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">How to Pick the Ideal Framework</span>"
-                    }
+                    id: 'XWG64zeXFo',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Instead of replacing your personal customer relationships, technology strengthens them by ensuring no customer is forgotten.</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">—--------------------------------------------------------------------------------------------------------------------</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Other strategies </span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Launch a Gold Savings Scheme</span>',
+                    },
                 },
                 {
-                    "id": "eBepeuEj5o",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;The ideal framework is determined by your own objectives and the kind of projects you wish to construct. As you get better, start with the easy and work your way up to the harder.</span>"
-                    }
+                    id: 'kp5J8fAJY1',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Automate WhatsApp Payment Reminders</span>',
+                    },
                 },
                 {
-                    "id": "Cn4NWTK6zt",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Concluding Remarks on Web Development</span>"
-                    }
+                    id: 'nRtfEBFVVC',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Replace Paper Passbooks with Digital Passbooks</span>',
+                    },
                 },
                 {
-                    "id": "5EoA4But4R",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Since progress occurs when mistakes are made, learn from them and don't be afraid of them. Explore web programming while continuously learning new frameworks and technologies. You have only just begun your journey!</span>"
-                    }
+                    id: '5vQ5XPtHMS',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Build a Customer Database</span>',
+                    },
                 },
                 {
-                    "id": "vLKrOczs4d",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;FAQs</span>"
-                    }
+                    id: '8_hfT_gfRB',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Personalize Every Customer Interaction</span>',
+                    },
                 },
                 {
-                    "id": "GmYWFU8_cZ",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Which framework is the simplest for a novice?</span>"
-                    }
+                    id: 'WFKlteD8Kv',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Create a Jewellery Loyalty Program</span>',
+                    },
                 },
                 {
-                    "id": "Zv7wQl8G0w",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Vue.js is the easiest to use because of its straightforward syntax and ease of use.</span>"
-                    }
+                    id: 'PVFMJpMwG4',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Recover Inactive Customers</span>',
+                    },
                 },
                 {
-                    "id": "PnvwjfSnz2",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">Is it possible for me to switch web frameworks later on in my development career?</span>"
-                    }
+                    id: 'MWRSH4ARCb',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Automate Customer Follow-ups</span>',
+                    },
                 },
                 {
-                    "id": "UV1tXiNGRo",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Of course! As they develop and their project's requirements evolve, developers frequently switch frameworks.</span>"
-                    }
+                    id: 'sjiKzwCrel',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Celebrate Birthdays &amp; Anniversaries</span>',
+                    },
                 },
                 {
-                    "id": "JGENKf2cs3",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Does using these frameworks require my knowledge of programming languages?</span>"
-                    }
+                    id: 'JQpBXE6dlq',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Run Festival Marketing Campaigns</span>',
+                    },
                 },
                 {
-                    "id": "JJS9VCbEqf",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Yes, mastering these frameworks will benefit greatly by having a basic understanding of Python or JavaScript.</span>"
-                    }
+                    id: 'jg8ONHkNjf',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Offer Referral Rewards</span>',
+                    },
                 },
                 {
-                    "id": "p6mT7ZkgFM",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Does each framework have any particular projects that I should begin with?</span>"
-                    }
+                    id: '81ad5L3GEn',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Track Customer Purchase History</span>',
+                    },
                 },
                 {
-                    "id": "g9lzRQ7xbK",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Start with something basic, like a portfolio website constructed using the framework you choose, a personal blog, or a to-do list application.</span>"
-                    }
+                    id: 'T82owhXECh',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Segment Customers Based on Buying Behaviour</span>',
+                    },
                 },
                 {
-                    "id": "bHpNK_2OOh",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;</span><span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">To what extent does the community play a role in framework selection?</span>"
-                    }
+                    id: '3zTjcoV-Ku',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Send Gold Rate &amp; New Collection Updates</span>',
+                    },
                 },
                 {
-                    "id": "lbqsoESpxP",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;Crucial! More information, lessons, and assistance when you run into problems are all part of a robust community.</span>"
-                    }
+                    id: 'PmdDZ5Jkir',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Improve In-Store Customer Experience</span>',
+                    },
                 },
                 {
-                    "id": "R-uKQn30Tv",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;By: Gaurav Sharma</span>"
-                    }
+                    id: '139x-wirAi',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Use Jewellery CRM Software</span>',
+                    },
                 },
                 {
-                    "id": "eSjeLO8MWe",
-                    "type": "paragraph",
-                    "data": {
-                        "text": "<span style=\"font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;\">&nbsp;&nbsp;(Founder “Tejsoft”)</span>"
-                    }
-                }
+                    id: 'VUJd-tT-Eu',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Measure Customer Retention Metrics</span>',
+                    },
+                },
+                {
+                    id: 'k1Oj2zBVeZ',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Collect Customer Feedback &amp; Reviews</span>',
+                    },
+                },
+                {
+                    id: 'zCXobUMJOb',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Analyze Customer Buying Trends</span>',
+                    },
+                },
+                {
+                    id: 'SaDYv1p6sg',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Digitize Your Jewellery Business with PassbookApp</span>',
+                    },
+                },
+                {
+                    id: 'itszx-eghp',
+                    type: 'header',
+                    data: {
+                        text: 'Final Thoughts',
+                        level: 1,
+                    },
+                },
+                {
+                    id: 'DWZ9Y5DpTi',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">The future of jewellery retail belongs to businesses that focus not only on acquiring customers but also on retaining them.</span>',
+                    },
+                },
+                {
+                    id: 'sh__WfsKsR',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Every missed follow-up, forgotten anniversary, or delayed reminder is a missed opportunity to strengthen a customer relationship.</span>',
+                    },
+                },
+                {
+                    id: '-yIVi7hG1p',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">By implementing structured customer retention strategies—such as gold savings schemes, automated reminders, personalized engagement, and digital customer management—you can increase repeat purchases, improve loyalty, and create a more predictable stream of recurring business.</span>',
+                    },
+                },
+                {
+                    id: 'fqIBVidohQ',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">PassbookApp is designed to support this journey by helping jewellery retailers digitize customer management, automate gold scheme operations, and deliver a modern experience that keeps customers coming back.</span>',
+                    },
+                },
+                {
+                    id: 'ijRpOnUsO4',
+                    type: 'header',
+                    data: {
+                        text: 'Frequently Asked Questions',
+                        level: 2,
+                    },
+                },
+                {
+                    id: 'IBJcODGBFG',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">How can a jewellery store increase repeat customers?</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> Focus on customer retention through gold savings schemes, personalized communication, WhatsApp reminders, loyalty programs, and regular engagement.</span>',
+                    },
+                },
+                {
+                    id: 'Hw_lhi15c5',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Why do customers stop visiting jewellery stores?</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> The most common reasons are lack of follow-up, poor engagement, and competitors maintaining stronger communication.</span>',
+                    },
+                },
+                {
+                    id: 'ADBXyeKS4e',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">What is the best software for managing jewellery customers?</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> A platform that combines customer records, digital passbooks, gold scheme management, payment tracking, and automated reminders can simplify operations and improve retention.</span>',
+                    },
+                },
+                {
+                    id: 'E4QcS9ieOL',
+                    type: 'paragraph',
+                    data: {
+                        text: '<span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Do gold savings schemes help customer loyalty?</span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"></span><span style="font-size:11pt;font-family:Arial,sans-serif;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> Yes. They encourage regular monthly interaction, improve retention, and increase the likelihood of future purchases.</span>',
+                    },
+                },
+                {
+                    id: 'dvXEFf_A4B',
+                    type: 'header',
+                    data: {
+                        text: '<a href="https://www.passbookapp.in/demo">Book a Free Demo</a>',
+                        level: 2,
+                    },
+                },
             ],
-            "createdBy": "Simpo",
-            "postSummary": "  Selecting the best framework in the constantly changing field of web development can be difficult, particularly for novices. By outlining the features and advantages of some of the greatest web development frameworks on the market today, this post seeks to assist novices in choosing the one that would best meet their requirements.",
-            "postTitle": "A Complete Guide to the Top 5 Web Development Frameworks for Novices",
-            "newPostTitle": "A-Complete-Guide-to-the-Top-5-Web-Development-Frameworks-for-Novices",
-            "blogMeta": {
-                "metaTitle": "",
-                "metaDescription": {
-                    "name": "description",
-                    "content": ""
-                }
+            createdBy: 'Raj',
+            postSummary: 'Discover 15 proven strategies to increase repeat customers in your jewellery store using gold schemes, WhatsApp reminders, customer retention software, and digital customer management.',
+            postTitle: 'How to Increase Repeat Customers in a Jewellery Store',
+            newPostTitle: 'How-to-Increase-Repeat-Customers-in-a-Jewellery-Store',
+            blogMeta: {
+                metaTitle: 'How to Increase Repeat Customers in a Jewellery Store',
+                metaDescription: {
+                    name: 'description',
+                    content: 'Discover 15 proven strategies to increase repeat customers in your jewellery store using gold schemes, WhatsApp reminders, customer retention software, and digital customer management.',
+                },
             },
-            "createdTimeStamp": "2024-12-14T17:01:38.000+00:00",
-            "publishedDate": null,
-            "blogScheduledDate": "2024-12-14T00:00:00.000+00:00",
-            "blogScheduleTime": "22:34:14",
-            "keyWords": {
-                "name": "keywords",
-                "content": " web development framework, technology, business needs"
+            createdTimeStamp: '2026-07-22T12:09:09.000+00:00',
+            publishedDate: null,
+            blogScheduledDate: '2026-07-22T00:00:00.000+00:00',
+            blogScheduleTime: '17:40:20',
+            keyWords: {
+                name: 'keywords',
+                content: 'WhatsApp CRM,WhatsApp marketing for jewellers,Jewellery WhatsApp reminders,Jewellery Business Growth',
             },
-            "author": {
-                "name": "author",
-                "content": "Gaurav Sharma"
+            author: {
+                name: 'author',
+                content: 'Passbookapp',
             },
-            "blogStatus": "PUBLISH",
-            "businessId": "1ef595b4-d80d-66de-9df6-13a8e47644dd",
-            "blogType": "BUSINESS"
+            blogStatus: 'PUBLISH',
+            blogType: 'BUSINESS',
         };
+        this.tocItems = [];
+        this.tocOpen = false;
+        this.activeTocId = null;
+        this.headingBlockIds = new Set();
+        this.isBrowser = isPlatformBrowser(platformId);
     }
     ngOnInit() {
+        this.buildTableOfContents();
+    }
+    ngOnChanges(changes) {
+        if (changes['responseData'] && !changes['responseData'].isFirstChange()) {
+            this.buildTableOfContents();
+        }
+    }
+    ngAfterViewInit() {
+        this.setupScrollSpy();
+    }
+    ngOnDestroy() {
+        this.tocObserver?.disconnect();
     }
     editSection() {
         // this._eventService.toggleEditorEvent.emit(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ViewBlogComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ViewBlogComponent, isStandalone: true, selector: "simpo-view-blog", inputs: { responseData: "responseData" }, ngImport: i0, template: "<section class=\"main-section\">\n  <div class=\"blog-details\">\n    <!-- <h1 class=\"blog-title\">{{responseData.postTitle}}</h1> -->\n    <div style=\"margin-top: 20px;\">\n      <ng-container *ngFor=\"let item of responseData?.blocks\">\n        <div *ngIf=\"item.type=='header'\">\n          <h1 *ngIf=\"item.data.level==1\" [innerHTML]=\"item.data.text\"></h1>\n          <h2 *ngIf=\"item.data.level==2\" [innerHTML]=\"item.data.text\"></h2>\n          <h3 *ngIf=\"item.data.level==3\" [innerHTML]=\"item.data.text\"></h3>\n          <h4 *ngIf=\"item.data.level==4\" [innerHTML]=\"item.data.text\"></h4>\n          <h5 *ngIf=\"item.data.level==5\" [innerHTML]=\"item.data.text\"></h5>\n          <h6 *ngIf=\"item.data.level==6\" [innerHTML]=\"item.data.text\"></h6>\n        </div>\n        <div *ngIf=\"item.type=='paragraph'\">\n          <p class=\"inner-text\" [innerHTML]=\"item.data.text\"></p>\n        </div>\n        <div *ngIf=\"item.type=='list'\">\n          <div *ngIf=\"item.type=='list'\">\n            <div *ngIf=\"item.data.style=='ordered'\">\n              <ol class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ol>\n            </div>\n            <div *ngIf=\"item.data.style=='unordered'\">\n              <ul class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ul>\n            </div>\n          </div>\n        </div>\n        <div *ngIf=\"item.type=='delimiter'\" class=\"ce-delimiter\">\n        </div>\n        <div *ngIf=\"item.type=='image'\" class=\"image-container\">\n          <img loading=\"lazy\"  [src]=\"item.data.file.url\" alt=\"\" loading=\"lazy\">\n        </div>\n        <div *ngIf=\"item.type=='table'\">\n\n          <table>\n            <ng-container *ngFor=\"let data of item.data.content\">\n              <tr>\n                <ng-container *ngFor=\"let item of data\">\n                  <td [innerHTML]=\"item\"></td>\n                </ng-container>\n              </tr>\n            </ng-container>\n          </table>\n\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</section>\n", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.main-section{padding:5%;background-color:#fff}.blog-details{width:60%;margin:0 auto}.delimiter{display:flex;justify-content:center}.ce-delimiter:before{display:inline-block;content:\"***\";font-size:30px;line-height:65px;height:30px;letter-spacing:.2em}p{line-height:1.6em}.back-text{@include body16r();margin-left:9px;margin-top:1px;cursor:pointer}table{border-collapse:collapse;width:100%}th,td{border:1px solid black;text-align:center}.header{margin-top:8px;margin-bottom:14px;padding-left:20px}.header img,.configuration-tab img{cursor:pointer}.blogs-totalsection{background:#eee;position:absolute;top:55px;height:calc(100vh - 55px);width:81.7%;z-index:10;overflow-y:scroll;padding:14px}.blog-title{line-height:35px}.image-container{width:100%;margin:10px 0}.image-container img{width:100%}h1,h2,h3,h4,h5,h6{padding:.6em 0 3px}.h1,.h2,.h3,h1,h2,h3{margin-top:0}.list-style li{text-align:left}@media only screen and (max-width :500px){.blog-details{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    scrollToBlock(event, blockId) {
+        event.preventDefault();
+        if (!this.isBrowser) {
+            return;
+        }
+        this._elementRef.nativeElement
+            .querySelector(`#block-${blockId}`)
+            ?.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        this.tocOpen = false;
+    }
+    buildTableOfContents() {
+        const blocks = this.responseData?.blocks || [];
+        this.headingBlockIds.clear();
+        this.tocItems = blocks
+            .map(block => this.getHeadingCandidate(block))
+            .filter((item) => !!item);
+        this.tocItems.forEach(item => this.headingBlockIds.add(item.id));
+        if (this.isBrowser) {
+            // Re-attach the scroll spy since the anchors it watches just changed.
+            setTimeout(() => this.setupScrollSpy());
+        }
+    }
+    isTocAnchor(blockId) {
+        return this.headingBlockIds.has(blockId);
+    }
+    hasVisibleText(html) {
+        return this.stripHtml(html).length > 0;
+    }
+    getHeadingCandidate(block) {
+        if (!block?.id) {
+            return null;
+        }
+        if (block.type === 'header') {
+            const level = block.data?.['level'] || 2;
+            const text = this.stripHtml(block.data?.['text']);
+            if (level <= 1 || !text) {
+                return null;
+            }
+            return { id: block.id, text };
+        }
+        if (block.type === 'paragraph') {
+            return this.getBoldParagraphHeading(block);
+        }
+        return null;
+    }
+    getBoldParagraphHeading(block) {
+        const html = block.data?.['text'] || '';
+        if (!html.includes('<span')) {
+            return null;
+        }
+        const spanRegex = /<span([^>]*)>([\s\S]*?)<\/span>/g;
+        let match;
+        let boldText = '';
+        let nonBoldText = '';
+        let maxFontSizePt = 0;
+        while ((match = spanRegex.exec(html))) {
+            const style = match[1];
+            const innerText = this.stripHtml(match[2]);
+            const isBold = /font-weight:\s*(bold|[6-9]00)/i.test(style);
+            const sizeMatch = style.match(/font-size:\s*([\d.]+)pt/i);
+            if (sizeMatch) {
+                maxFontSizePt = Math.max(maxFontSizePt, parseFloat(sizeMatch[1]));
+            }
+            if (isBold) {
+                boldText += innerText;
+            }
+            else if (innerText) {
+                nonBoldText += innerText;
+            }
+        }
+        const text = boldText.trim();
+        // Mixed bold/plain text is an emphasized phrase inside a normal paragraph, not a heading.
+        if (!text || nonBoldText.trim() || text.length > 120) {
+            return null;
+        }
+        // Title-sized bold text (>=16pt, matching the article's own heading) isn't a TOC entry.
+        if (maxFontSizePt >= 16) {
+            return null;
+        }
+        return { id: block.id, text };
+    }
+    stripHtml(html) {
+        if (!html) {
+            return '';
+        }
+        return html
+            .replace(/<[^>]*>/g, '')
+            .replace(/&nbsp;/g, ' ')
+            .replace(/&amp;/g, '&')
+            .trim();
+    }
+    setupScrollSpy() {
+        if (!this.isBrowser) {
+            return;
+        }
+        this.tocObserver?.disconnect();
+        const anchors = Array.from(this._elementRef.nativeElement.querySelectorAll('.toc-anchor'));
+        if (!anchors.length) {
+            return;
+        }
+        this.tocObserver = new IntersectionObserver(entries => {
+            const visible = entries.filter(entry => entry.isIntersecting);
+            if (visible.length) {
+                this.activeTocId = visible[0].target.id.replace('block-', '');
+            }
+        }, { rootMargin: '0px 0px -70% 0px' });
+        anchors.forEach(anchor => this.tocObserver?.observe(anchor));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ViewBlogComponent, deps: [{ token: EventsService }, { token: i0.ElementRef }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ViewBlogComponent, isStandalone: true, selector: "simpo-view-blog", inputs: { responseData: "responseData" }, usesOnChanges: true, ngImport: i0, template: "<section class=\"main-section\">\n  <div class=\"blog-container\">\n    <h1 class=\"blog-title\" *ngIf=\"responseData?.postTitle\">\n      {{ responseData.postTitle }}\n    </h1>\n\n    <div class=\"meta-bar\">\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Publication Date</span>\n        <span class=\"meta-value\">{{\n          responseData?.publishedDate ||\n            responseData?.blogScheduledDate ||\n            responseData?.createdTimeStamp | date: 'd MMMM y'\n        }}</span>\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Author</span>\n        <span class=\"meta-value\">{{\n          responseData?.author?.content || '\u2014'\n        }}</span>\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Read Time</span>\n        <span class=\"meta-value\"\n          >{{ responseData?.readTime || '\u2014' }} min read</span\n        >\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Views</span>\n        <span class=\"meta-value\">{{ responseData?.totalVisits || 0 }}+</span>\n      </div>\n    </div>\n\n    <div class=\"blog-layout\" [class.with-toc]=\"tocItems.length > 1\">\n      <aside class=\"toc-sidebar\" *ngIf=\"tocItems.length > 1\">\n        <button\n          type=\"button\"\n          class=\"toc-toggle\"\n          (click)=\"tocOpen = !tocOpen\"\n          [attr.aria-expanded]=\"tocOpen\">\n          <span>Table Of Content</span>\n          <span class=\"toc-toggle-icon\" [class.open]=\"tocOpen\"></span>\n        </button>\n        <div class=\"toc-header\">Table Of Content</div>\n        <nav class=\"toc-list\" [class.open]=\"tocOpen\">\n          <a\n            *ngFor=\"let toc of tocItems\"\n            class=\"toc-link\"\n            [class.active]=\"activeTocId === toc.id\"\n            [href]=\"'#block-' + toc.id\"\n            (click)=\"scrollToBlock($event, toc.id)\">\n            {{ toc.text }}\n          </a>\n        </nav>\n      </aside>\n\n      <div class=\"blog-details\">\n        <ng-container *ngFor=\"let item of responseData?.blocks\">\n          <div\n            *ngIf=\"item.type == 'header' && hasVisibleText(item.data?.text)\"\n            [id]=\"'block-' + item.id\"\n            [class.toc-anchor]=\"isTocAnchor(item.id)\">\n            <h1 *ngIf=\"item.data.level == 1\" [innerHTML]=\"item.data.text\"></h1>\n            <h2 *ngIf=\"item.data.level == 2\" [innerHTML]=\"item.data.text\"></h2>\n            <h3 *ngIf=\"item.data.level == 3\" [innerHTML]=\"item.data.text\"></h3>\n            <h4 *ngIf=\"item.data.level == 4\" [innerHTML]=\"item.data.text\"></h4>\n            <h5 *ngIf=\"item.data.level == 5\" [innerHTML]=\"item.data.text\"></h5>\n            <h6 *ngIf=\"item.data.level == 6\" [innerHTML]=\"item.data.text\"></h6>\n          </div>\n          <div\n            *ngIf=\"item.type == 'paragraph' && hasVisibleText(item.data?.text)\"\n            [id]=\"'block-' + item.id\"\n            [class.toc-anchor]=\"isTocAnchor(item.id)\">\n            <p\n              class=\"inner-text\"\n              [class.heading-paragraph]=\"isTocAnchor(item.id)\"\n              [innerHTML]=\"item.data.text\"></p>\n          </div>\n          <div *ngIf=\"item.type == 'list'\">\n            <div *ngIf=\"item.data.style == 'ordered'\">\n              <ol class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ol>\n            </div>\n            <div *ngIf=\"item.data.style == 'unordered'\">\n              <ul class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ul>\n            </div>\n          </div>\n          <div *ngIf=\"item.type == 'delimiter'\" class=\"ce-delimiter\"></div>\n          <div *ngIf=\"item.type == 'image'\" class=\"image-container\">\n            <img\n              loading=\"lazy\"\n              [src]=\"item.data.file.url\"\n              alt=\"\"\n              loading=\"lazy\" />\n          </div>\n          <div *ngIf=\"item.type == 'table'\">\n            <div class=\"table-wrapper\">\n              <table\n                [class.table-no-heading]=\"item.data.withHeadings === false\">\n                <ng-container *ngFor=\"let data of item.data.content\">\n                  <tr>\n                    <ng-container *ngFor=\"let item of data\">\n                      <td [innerHTML]=\"item\"></td>\n                    </ng-container>\n                  </tr>\n                </ng-container>\n              </table>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</section>\n", styles: [":host{display:block;width:100%}*,*:before,*:after{box-sizing:border-box}*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.main-section{padding:2% 5%;background-color:#fff}.blog-container{width:85%;margin:0 auto}.blog-title{font-size:2em;font-weight:700;line-height:1.25em;margin:0 0 20px}.meta-bar{display:flex;gap:12px;margin-bottom:28px}.meta-item{flex:1;background-color:#f5f5f5;border-radius:6px;padding:12px 10px;text-align:center}.meta-label{display:block;font-size:.75em;color:#8a8a8a;letter-spacing:.02em;margin-bottom:6px}.meta-value{display:block;font-size:.95em;font-weight:700;color:#1a1a1a}.blog-layout{display:block}.blog-layout.with-toc{display:flex;align-items:flex-start;gap:40px}.with-toc .blog-details{flex:1;min-width:0;order:1}.toc-sidebar{width:340px;flex-shrink:0;position:sticky;top:20px;background-color:#f5f5f5;border-radius:6px;padding:16px;order:2}.toc-header{font-weight:700;font-size:1.05em;padding-bottom:12px;margin-bottom:8px;border-bottom:1px solid #dcdcdc}.toc-toggle{display:none;width:100%;align-items:center;justify-content:space-between;background:none;border:none;font-weight:700;font-size:1.05em;padding:0;cursor:pointer}.toc-toggle-icon{width:10px;height:10px;border-right:2px solid #1a1a1a;border-bottom:2px solid #1a1a1a;transform:rotate(45deg);transition:transform .2s ease}.toc-toggle-icon.open{transform:rotate(-135deg)}.toc-list{display:flex;flex-direction:column;gap:14px;max-height:600px;overflow-y:auto;padding-right:8px;scrollbar-width:thin;scrollbar-color:#c9c9c9 transparent}.toc-list::-webkit-scrollbar{display:block;width:6px}.toc-list::-webkit-scrollbar-track{background-color:transparent}.toc-list::-webkit-scrollbar-thumb{display:block;background-color:#c9c9c9;border-radius:3px}.toc-link{color:#6f6f6f;text-decoration:none;font-size:.92em;line-height:1.4em}.toc-link:hover{color:#1a1a1a}.toc-link.active{color:#1a1a1a;font-weight:700}.delimiter{display:flex;justify-content:center}.ce-delimiter:before{display:inline-block;content:\"***\";font-size:30px;line-height:65px;height:30px;letter-spacing:.2em}p{line-height:1.6em}.back-text{@include body16r();margin-left:9px;margin-top:1px;cursor:pointer}.table-wrapper{width:100%;overflow-x:auto;margin:16px 0;border-radius:8px;border:1px solid #ececec}table{border-collapse:collapse;width:100%}th,td{border:1px solid #ececec;padding:10px 14px;text-align:left}table:not(.table-no-heading) tr:first-child td{background-color:#eee;font-weight:700;text-transform:uppercase;font-size:.82em}table:not(.table-no-heading) tr:not(:first-child):nth-child(2n) td{background-color:#fafafa}table.table-no-heading tr:nth-child(odd) td{background-color:#fafafa}.header{margin-top:8px;margin-bottom:14px;padding-left:20px}.header img,.configuration-tab img{cursor:pointer}.blogs-totalsection{background:#eee;position:absolute;top:55px;height:calc(100vh - 55px);width:81.7%;z-index:10;overflow-y:scroll;padding:14px}.blog-title{line-height:35px}.image-container{width:100%;margin:10px 0}.image-container img{width:100%}h1,h2,h3,h4,h5,h6{padding:.6em 0 3px}.h1,.h2,.h3,h1,h2,h3{margin-top:0}h2,h3,h4,h5,h6,.inner-text.heading-paragraph{font-weight:700;padding-bottom:12px;margin-bottom:8px;border-bottom:1px solid #ececec}.list-style{margin:16px 0;padding-left:22px;list-style-position:outside}.list-style li{text-align:left;line-height:1.6em;padding-left:6px}.list-style li:not(:last-child){margin-bottom:10px}.list-style li::marker{color:#1a1a1a;font-weight:700}@media only screen and (max-width: 900px){.blog-container{width:100%}.blog-layout.with-toc{flex-direction:column}.toc-sidebar{width:100%;position:static;box-sizing:border-box;order:0}.with-toc .blog-details{order:1}.toc-header{display:none}.toc-toggle{display:flex}.toc-list{display:none;margin-top:12px}.toc-list.open{display:flex}.meta-bar{flex-wrap:wrap}.meta-item{flex-basis:calc(50% - 6px)}}@media only screen and (max-width: 500px){.blog-details{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ViewBlogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'simpo-view-blog', standalone: true, imports: [CommonModule], template: "<section class=\"main-section\">\n  <div class=\"blog-details\">\n    <!-- <h1 class=\"blog-title\">{{responseData.postTitle}}</h1> -->\n    <div style=\"margin-top: 20px;\">\n      <ng-container *ngFor=\"let item of responseData?.blocks\">\n        <div *ngIf=\"item.type=='header'\">\n          <h1 *ngIf=\"item.data.level==1\" [innerHTML]=\"item.data.text\"></h1>\n          <h2 *ngIf=\"item.data.level==2\" [innerHTML]=\"item.data.text\"></h2>\n          <h3 *ngIf=\"item.data.level==3\" [innerHTML]=\"item.data.text\"></h3>\n          <h4 *ngIf=\"item.data.level==4\" [innerHTML]=\"item.data.text\"></h4>\n          <h5 *ngIf=\"item.data.level==5\" [innerHTML]=\"item.data.text\"></h5>\n          <h6 *ngIf=\"item.data.level==6\" [innerHTML]=\"item.data.text\"></h6>\n        </div>\n        <div *ngIf=\"item.type=='paragraph'\">\n          <p class=\"inner-text\" [innerHTML]=\"item.data.text\"></p>\n        </div>\n        <div *ngIf=\"item.type=='list'\">\n          <div *ngIf=\"item.type=='list'\">\n            <div *ngIf=\"item.data.style=='ordered'\">\n              <ol class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ol>\n            </div>\n            <div *ngIf=\"item.data.style=='unordered'\">\n              <ul class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ul>\n            </div>\n          </div>\n        </div>\n        <div *ngIf=\"item.type=='delimiter'\" class=\"ce-delimiter\">\n        </div>\n        <div *ngIf=\"item.type=='image'\" class=\"image-container\">\n          <img loading=\"lazy\"  [src]=\"item.data.file.url\" alt=\"\" loading=\"lazy\">\n        </div>\n        <div *ngIf=\"item.type=='table'\">\n\n          <table>\n            <ng-container *ngFor=\"let data of item.data.content\">\n              <tr>\n                <ng-container *ngFor=\"let item of data\">\n                  <td [innerHTML]=\"item\"></td>\n                </ng-container>\n              </tr>\n            </ng-container>\n          </table>\n\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</section>\n", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.main-section{padding:5%;background-color:#fff}.blog-details{width:60%;margin:0 auto}.delimiter{display:flex;justify-content:center}.ce-delimiter:before{display:inline-block;content:\"***\";font-size:30px;line-height:65px;height:30px;letter-spacing:.2em}p{line-height:1.6em}.back-text{@include body16r();margin-left:9px;margin-top:1px;cursor:pointer}table{border-collapse:collapse;width:100%}th,td{border:1px solid black;text-align:center}.header{margin-top:8px;margin-bottom:14px;padding-left:20px}.header img,.configuration-tab img{cursor:pointer}.blogs-totalsection{background:#eee;position:absolute;top:55px;height:calc(100vh - 55px);width:81.7%;z-index:10;overflow-y:scroll;padding:14px}.blog-title{line-height:35px}.image-container{width:100%;margin:10px 0}.image-container img{width:100%}h1,h2,h3,h4,h5,h6{padding:.6em 0 3px}.h1,.h2,.h3,h1,h2,h3{margin-top:0}.list-style li{text-align:left}@media only screen and (max-width :500px){.blog-details{width:100%}}\n"] }]
-        }], ctorParameters: () => [{ type: EventsService }], propDecorators: { responseData: [{
+            args: [{ selector: 'simpo-view-blog', standalone: true, imports: [CommonModule, DatePipe], template: "<section class=\"main-section\">\n  <div class=\"blog-container\">\n    <h1 class=\"blog-title\" *ngIf=\"responseData?.postTitle\">\n      {{ responseData.postTitle }}\n    </h1>\n\n    <div class=\"meta-bar\">\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Publication Date</span>\n        <span class=\"meta-value\">{{\n          responseData?.publishedDate ||\n            responseData?.blogScheduledDate ||\n            responseData?.createdTimeStamp | date: 'd MMMM y'\n        }}</span>\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Author</span>\n        <span class=\"meta-value\">{{\n          responseData?.author?.content || '\u2014'\n        }}</span>\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Read Time</span>\n        <span class=\"meta-value\"\n          >{{ responseData?.readTime || '\u2014' }} min read</span\n        >\n      </div>\n      <div class=\"meta-item\">\n        <span class=\"meta-label\">Views</span>\n        <span class=\"meta-value\">{{ responseData?.totalVisits || 0 }}+</span>\n      </div>\n    </div>\n\n    <div class=\"blog-layout\" [class.with-toc]=\"tocItems.length > 1\">\n      <aside class=\"toc-sidebar\" *ngIf=\"tocItems.length > 1\">\n        <button\n          type=\"button\"\n          class=\"toc-toggle\"\n          (click)=\"tocOpen = !tocOpen\"\n          [attr.aria-expanded]=\"tocOpen\">\n          <span>Table Of Content</span>\n          <span class=\"toc-toggle-icon\" [class.open]=\"tocOpen\"></span>\n        </button>\n        <div class=\"toc-header\">Table Of Content</div>\n        <nav class=\"toc-list\" [class.open]=\"tocOpen\">\n          <a\n            *ngFor=\"let toc of tocItems\"\n            class=\"toc-link\"\n            [class.active]=\"activeTocId === toc.id\"\n            [href]=\"'#block-' + toc.id\"\n            (click)=\"scrollToBlock($event, toc.id)\">\n            {{ toc.text }}\n          </a>\n        </nav>\n      </aside>\n\n      <div class=\"blog-details\">\n        <ng-container *ngFor=\"let item of responseData?.blocks\">\n          <div\n            *ngIf=\"item.type == 'header' && hasVisibleText(item.data?.text)\"\n            [id]=\"'block-' + item.id\"\n            [class.toc-anchor]=\"isTocAnchor(item.id)\">\n            <h1 *ngIf=\"item.data.level == 1\" [innerHTML]=\"item.data.text\"></h1>\n            <h2 *ngIf=\"item.data.level == 2\" [innerHTML]=\"item.data.text\"></h2>\n            <h3 *ngIf=\"item.data.level == 3\" [innerHTML]=\"item.data.text\"></h3>\n            <h4 *ngIf=\"item.data.level == 4\" [innerHTML]=\"item.data.text\"></h4>\n            <h5 *ngIf=\"item.data.level == 5\" [innerHTML]=\"item.data.text\"></h5>\n            <h6 *ngIf=\"item.data.level == 6\" [innerHTML]=\"item.data.text\"></h6>\n          </div>\n          <div\n            *ngIf=\"item.type == 'paragraph' && hasVisibleText(item.data?.text)\"\n            [id]=\"'block-' + item.id\"\n            [class.toc-anchor]=\"isTocAnchor(item.id)\">\n            <p\n              class=\"inner-text\"\n              [class.heading-paragraph]=\"isTocAnchor(item.id)\"\n              [innerHTML]=\"item.data.text\"></p>\n          </div>\n          <div *ngIf=\"item.type == 'list'\">\n            <div *ngIf=\"item.data.style == 'ordered'\">\n              <ol class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ol>\n            </div>\n            <div *ngIf=\"item.data.style == 'unordered'\">\n              <ul class=\"list-style\">\n                <ng-container *ngFor=\"let list of item.data.items\">\n                  <li [innerHTML]=\"list\"></li>\n                </ng-container>\n              </ul>\n            </div>\n          </div>\n          <div *ngIf=\"item.type == 'delimiter'\" class=\"ce-delimiter\"></div>\n          <div *ngIf=\"item.type == 'image'\" class=\"image-container\">\n            <img\n              loading=\"lazy\"\n              [src]=\"item.data.file.url\"\n              alt=\"\"\n              loading=\"lazy\" />\n          </div>\n          <div *ngIf=\"item.type == 'table'\">\n            <div class=\"table-wrapper\">\n              <table\n                [class.table-no-heading]=\"item.data.withHeadings === false\">\n                <ng-container *ngFor=\"let data of item.data.content\">\n                  <tr>\n                    <ng-container *ngFor=\"let item of data\">\n                      <td [innerHTML]=\"item\"></td>\n                    </ng-container>\n                  </tr>\n                </ng-container>\n              </table>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</section>\n", styles: [":host{display:block;width:100%}*,*:before,*:after{box-sizing:border-box}*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.main-section{padding:2% 5%;background-color:#fff}.blog-container{width:85%;margin:0 auto}.blog-title{font-size:2em;font-weight:700;line-height:1.25em;margin:0 0 20px}.meta-bar{display:flex;gap:12px;margin-bottom:28px}.meta-item{flex:1;background-color:#f5f5f5;border-radius:6px;padding:12px 10px;text-align:center}.meta-label{display:block;font-size:.75em;color:#8a8a8a;letter-spacing:.02em;margin-bottom:6px}.meta-value{display:block;font-size:.95em;font-weight:700;color:#1a1a1a}.blog-layout{display:block}.blog-layout.with-toc{display:flex;align-items:flex-start;gap:40px}.with-toc .blog-details{flex:1;min-width:0;order:1}.toc-sidebar{width:340px;flex-shrink:0;position:sticky;top:20px;background-color:#f5f5f5;border-radius:6px;padding:16px;order:2}.toc-header{font-weight:700;font-size:1.05em;padding-bottom:12px;margin-bottom:8px;border-bottom:1px solid #dcdcdc}.toc-toggle{display:none;width:100%;align-items:center;justify-content:space-between;background:none;border:none;font-weight:700;font-size:1.05em;padding:0;cursor:pointer}.toc-toggle-icon{width:10px;height:10px;border-right:2px solid #1a1a1a;border-bottom:2px solid #1a1a1a;transform:rotate(45deg);transition:transform .2s ease}.toc-toggle-icon.open{transform:rotate(-135deg)}.toc-list{display:flex;flex-direction:column;gap:14px;max-height:600px;overflow-y:auto;padding-right:8px;scrollbar-width:thin;scrollbar-color:#c9c9c9 transparent}.toc-list::-webkit-scrollbar{display:block;width:6px}.toc-list::-webkit-scrollbar-track{background-color:transparent}.toc-list::-webkit-scrollbar-thumb{display:block;background-color:#c9c9c9;border-radius:3px}.toc-link{color:#6f6f6f;text-decoration:none;font-size:.92em;line-height:1.4em}.toc-link:hover{color:#1a1a1a}.toc-link.active{color:#1a1a1a;font-weight:700}.delimiter{display:flex;justify-content:center}.ce-delimiter:before{display:inline-block;content:\"***\";font-size:30px;line-height:65px;height:30px;letter-spacing:.2em}p{line-height:1.6em}.back-text{@include body16r();margin-left:9px;margin-top:1px;cursor:pointer}.table-wrapper{width:100%;overflow-x:auto;margin:16px 0;border-radius:8px;border:1px solid #ececec}table{border-collapse:collapse;width:100%}th,td{border:1px solid #ececec;padding:10px 14px;text-align:left}table:not(.table-no-heading) tr:first-child td{background-color:#eee;font-weight:700;text-transform:uppercase;font-size:.82em}table:not(.table-no-heading) tr:not(:first-child):nth-child(2n) td{background-color:#fafafa}table.table-no-heading tr:nth-child(odd) td{background-color:#fafafa}.header{margin-top:8px;margin-bottom:14px;padding-left:20px}.header img,.configuration-tab img{cursor:pointer}.blogs-totalsection{background:#eee;position:absolute;top:55px;height:calc(100vh - 55px);width:81.7%;z-index:10;overflow-y:scroll;padding:14px}.blog-title{line-height:35px}.image-container{width:100%;margin:10px 0}.image-container img{width:100%}h1,h2,h3,h4,h5,h6{padding:.6em 0 3px}.h1,.h2,.h3,h1,h2,h3{margin-top:0}h2,h3,h4,h5,h6,.inner-text.heading-paragraph{font-weight:700;padding-bottom:12px;margin-bottom:8px;border-bottom:1px solid #ececec}.list-style{margin:16px 0;padding-left:22px;list-style-position:outside}.list-style li{text-align:left;line-height:1.6em;padding-left:6px}.list-style li:not(:last-child){margin-bottom:10px}.list-style li::marker{color:#1a1a1a;font-weight:700}@media only screen and (max-width: 900px){.blog-container{width:100%}.blog-layout.with-toc{flex-direction:column}.toc-sidebar{width:100%;position:static;box-sizing:border-box;order:0}.with-toc .blog-details{order:1}.toc-header{display:none}.toc-toggle{display:flex}.toc-list{display:none;margin-top:12px}.toc-list.open{display:flex}.meta-bar{flex-wrap:wrap}.meta-item{flex-basis:calc(50% - 6px)}}@media only screen and (max-width: 500px){.blog-details{width:100%}}\n"] }]
+        }], ctorParameters: () => [{ type: EventsService }, { type: i0.ElementRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }], propDecorators: { responseData: [{
                 type: Input
             }] } });