diff --git a/angular.json b/angular.json
index 51c330b34d..4ef6d1afe5 100644
--- a/angular.json
+++ b/angular.json
@@ -51,7 +51,7 @@
               "vendor": true
             },
             "styles": [
-              "node_modules/common-consumption-styles/assets/_styles.scss",
+              "node_modules/@project-sunbird/sb-styles/assets/_styles.scss",
               {
                 "input": "src/global.scss"
               }
diff --git a/package-lock.json b/package-lock.json
index f29c6e7bac..150f6bf08d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4846,9 +4846,9 @@
       }
     },
     "@project-sunbird/client-services": {
-      "version": "3.1.10",
-      "resolved": "https://registry.npmjs.org/@project-sunbird/client-services/-/client-services-3.1.10.tgz",
-      "integrity": "sha512-lGS2IDFyW4pAwXztyWa67XD/msJK4BY2GiGwZpM8FZvB44Czm4ZctgbIz5HNK7Jbck/rZM+tqYRl46Kdro4mWg==",
+      "version": "3.1.13",
+      "resolved": "https://registry.npmjs.org/@project-sunbird/client-services/-/client-services-3.1.13.tgz",
+      "integrity": "sha512-DHYOxXbMtD4pWnOdevTFypCwDCNKtJlssDLCJp0jPmOR3mFThGy0RIYKI/Z0r+wmvE7qxfZVFyz8AiqvVItKSA==",
       "requires": {
         "inversify": "^5.0.1",
         "qs": "^6.9.4",
@@ -4864,9 +4864,9 @@
       }
     },
     "@project-sunbird/common-consumption": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/@project-sunbird/common-consumption/-/common-consumption-3.1.6.tgz",
-      "integrity": "sha512-iHEjRkoEqOa2ZdtjJrfgLg0NtDaaMdcEGM0zDjryYihU3pZSZeAxJd0dwSc8UjP7Enrlov5USq3lxBPFTTsKeA==",
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/@project-sunbird/common-consumption/-/common-consumption-3.1.8.tgz",
+      "integrity": "sha512-ua4/MuCH2KeqZvw5Aa4P9mUQuYUK1j4H6GvLS8VNvR8PGZP4Mdt1Sqc3bmT/YGGrN2W9/rAjOgDkzvVV7p8ejA==",
       "requires": {
         "tslib": "^1.9.0"
       }
@@ -5016,10 +5016,15 @@
         }
       }
     },
+    "@project-sunbird/sb-styles": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/@project-sunbird/sb-styles/-/sb-styles-0.0.1.tgz",
+      "integrity": "sha512-FqL3/prg39YfvkTz2U7221eCEjGHrdbCrt7m4CGAz7thbt9cwRNINRNxWsAzsqpUXky0SAmyjahmRzg8gaJ9Dg=="
+    },
     "@project-sunbird/sunbird-sdk": {
-      "version": "3.1.9",
-      "resolved": "https://registry.npmjs.org/@project-sunbird/sunbird-sdk/-/sunbird-sdk-3.1.9.tgz",
-      "integrity": "sha512-E8EX8lyOc3Sk6fxy+WTrDqak3rCQTRBkeAZeqlKiqNTFmpV7WhXfYIyjW6x8PYxummoECpD6lV8IU0w9Fr5qMQ==",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/@project-sunbird/sunbird-sdk/-/sunbird-sdk-3.1.10.tgz",
+      "integrity": "sha512-cwaSw8VdcafRRDywEnX6TLOoE7sL1/q355mep6Ie20A3objbhQdFDu8Yc0vYozmnjlbPGXe3wRI4fB04YYvhag==",
       "requires": {
         "crypto-js": "^3.1.9-1",
         "dayjs": "^1.8.20",
@@ -7174,11 +7179,6 @@
       "integrity": "sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==",
       "dev": true
     },
-    "common-consumption-styles": {
-      "version": "0.0.14",
-      "resolved": "https://registry.npmjs.org/common-consumption-styles/-/common-consumption-styles-0.0.14.tgz",
-      "integrity": "sha512-+TLK8+8Bb6hX2a2dp0ZrT1snUCyORfV2295vzKfyl7Gr1xUZfkjcpRKRDSQBejZku9xgwnh/m0TxqZmOLVAxcg=="
-    },
     "commondir": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
@@ -20421,9 +20421,9 @@
       }
     },
     "whatwg-fetch": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.1.0.tgz",
-      "integrity": "sha512-pgmbsVWKpH9GxLXZmtdowDIqtb/rvPyjjQv3z9wLcmgWKFHilKnZD3ldgrOlwJoPGOUluQsRPWd52yVkPfmI1A=="
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.1.1.tgz",
+      "integrity": "sha512-UlBvc5VApYAwNutfXFeuC9Jp3QCMazcqobfNqSK/RghRr3F8b0+i/QELUlEPsHjDHfijio6H5KPJcZwYXhuZsA=="
     },
     "whatwg-mimetype": {
       "version": "2.3.0",
diff --git a/package.json b/package.json
index a8717c91cc..b2c5a500a8 100644
--- a/package.json
+++ b/package.json
@@ -47,14 +47,14 @@
     "@ionic/angular": "^4.11.2",
     "@ngx-translate/core": "^11.0.1",
     "@ngx-translate/http-loader": "^4.0.0",
-    "@project-sunbird/client-services": "^3.1.10",
-    "@project-sunbird/common-consumption": "^3.1.6",
+    "@project-sunbird/client-services": "^3.1.13",
+    "@project-sunbird/common-consumption": "^3.1.8",
     "@project-sunbird/content-player": "3.1.0",
-    "@project-sunbird/sunbird-sdk": "~3.1.9",
+    "@project-sunbird/sunbird-sdk": "~3.1.10",
+    "@project-sunbird/sb-styles": "0.0.1",
     "code-push": "^3.0.1",
     "com.jjdltc.cordova.plugin.zip": "https://github.com/swayangjit/jjdltc-cordova-plugin-zip.git",
     "com.telerik.plugins.nativepagetransitions": "^0.6.5",
-    "common-consumption-styles": "0.0.14",
     "cordova-android": "^8.1.0",
     "cordova-android-support-gradle-release": "^3.0.1",
     "cordova-plugin-advanced-http": "^2.4.1",
diff --git a/src/app/my-groups/my-groups.page.html b/src/app/my-groups/my-groups.page.html
index da405c7e1f..6371d6671b 100644
--- a/src/app/my-groups/my-groups.page.html
+++ b/src/app/my-groups/my-groups.page.html
@@ -18,7 +18,7 @@
       </div>
     </div>
 
-    <div *ngIf="!isGuestUser && !groupList.length" class="my-cr-card">
+    <div *ngIf="!isGuestUser && !groupList.length && !groupListLoader" class="my-cr-card">
       <div class="my-cr-card-img">
         <img src="assets/imgs/ic_my_groups.svg" alt="my-group">
       </div>
@@ -33,8 +33,12 @@
     </div>
 
     <div *ngFor="let group of groupList">
-      <sb-group-card [isMobile]="true" [group]="group" [isLoading]="groupListLoader"
-        (cardClick)="navigateToGroupdetailsPage($event)"></sb-group-card>
+      <sb-group-card [isMobile]="true" [group]="group" (cardClick)="navigateToGroupdetailsPage($event)"></sb-group-card>
+    </div>
+    <div *ngIf="!isGuestUser && groupListLoader">
+      <div *ngFor="let item of [0,1,2,3,4,5,6,7,8,9,10]">
+        <sb-group-card [isMobile]="true" [isLoading]="true"></sb-group-card>
+      </div>
     </div>
 
   </div>
diff --git a/src/app/my-groups/my-groups.page.ts b/src/app/my-groups/my-groups.page.ts
index ddb507c41d..d79098ca85 100644
--- a/src/app/my-groups/my-groups.page.ts
+++ b/src/app/my-groups/my-groups.page.ts
@@ -15,13 +15,13 @@ import {
   PageId,
   Environment, InteractType, InteractSubtype
 } from '@app/services';
-import {Platform, PopoverController} from '@ionic/angular';
+import { Platform, PopoverController } from '@ionic/angular';
 import { MyGroupsPopoverComponent } from '../components/popups/sb-my-groups-popover/sb-my-groups-popover.component';
 import { animationGrowInTopRight } from '../animations/animation-grow-in-top-right';
 import { animationShrinkOutTopRight } from '../animations/animation-shrink-out-top-right';
-import {SbProgressLoader} from '@app/services/sb-progress-loader.service';
-import {Subscription} from 'rxjs';
-import {Location} from '@angular/common';
+import { SbProgressLoader } from '@app/services/sb-progress-loader.service';
+import { Subscription } from 'rxjs';
+import { Location } from '@angular/common';
 
 interface GroupData extends Group {
   initial: string;
@@ -57,6 +57,9 @@ export class MyGroupsPage implements OnInit, OnDestroy {
 
   ngOnInit() {
     this.checkUserLoggedIn();
+    if (!this.isGuestUser) {
+      this.groupListLoader = true;
+    }
     this.appGlobalService.getActiveProfileUid()
       .then(async (uid) => {
         this.userId = uid;
@@ -81,13 +84,15 @@ export class MyGroupsPage implements OnInit, OnDestroy {
   }
 
   async ionViewDidEnter() {
-    this.sbProgressLoader.hide({id: 'login'});
-    this.fetchGroupList();
+    this.sbProgressLoader.hide({ id: 'login' });
+    if (!this.isGuestUser) {
+      this.fetchGroupList();
+    }
     this.telemetryGeneratorService.generateImpressionTelemetry(
-        ImpressionType.VIEW,
-        '',
-        PageId.MY_GROUP,
-        Environment.GROUP
+      ImpressionType.VIEW,
+      '',
+      PageId.MY_GROUP,
+      Environment.GROUP
     );
   }
 
@@ -106,29 +111,29 @@ export class MyGroupsPage implements OnInit, OnDestroy {
       case 'groupInfo':
         this.openinfopopup();
         break;
-        case 'back':
-            this.telemetryGeneratorService.generateBackClickedTelemetry(PageId.MY_GROUP, Environment.GROUP, true);
-            this.location.back();
-            break;
+      case 'back':
+        this.telemetryGeneratorService.generateBackClickedTelemetry(PageId.MY_GROUP, Environment.GROUP, true);
+        this.location.back();
+        break;
     }
   }
 
   createClassroom() {
     this.telemetryGeneratorService.generateInteractTelemetry(
-        InteractType.TOUCH,
-        InteractSubtype.CREATE_GROUP_CLICKED,
-        Environment.GROUP,
-        PageId.MY_GROUP
+      InteractType.TOUCH,
+      InteractSubtype.CREATE_GROUP_CLICKED,
+      Environment.GROUP,
+      PageId.MY_GROUP
     );
     this.router.navigate([`/${RouterLinks.MY_GROUPS}/${RouterLinks.CREATE_EDIT_GROUP}`]);
   }
 
   login() {
     this.telemetryGeneratorService.generateInteractTelemetry(
-        InteractType.TOUCH,
-        InteractSubtype.LOGIN_CLICKED,
-        Environment.GROUP,
-        PageId.MY_GROUP
+      InteractType.TOUCH,
+      InteractSubtype.LOGIN_CLICKED,
+      Environment.GROUP,
+      PageId.MY_GROUP
     );
     this.loginHandlerService.signIn({ skipRootNavigation: true });
   }
@@ -154,7 +159,8 @@ export class MyGroupsPage implements OnInit, OnDestroy {
         });
       this.groupListLoader = false;
       console.log('this.groupList', this.groupList);
-    } catch {
+    } catch (e) {
+      console.error(e);
       this.groupListLoader = false;
     }
   }
@@ -193,9 +199,9 @@ export class MyGroupsPage implements OnInit, OnDestroy {
   private handleBackButton() {
     this.unregisterBackButton = this.platform.backButton.subscribeWithPriority(10, () => {
       this.telemetryGeneratorService.generateBackClickedTelemetry(
-          PageId.MY_GROUP,
-          Environment.GROUP,
-          false);
+        PageId.MY_GROUP,
+        Environment.GROUP,
+        false);
       this.location.back();
     });
   }