diff --git a/src/_mock/departments.js b/src/_mock/departments.js
index 556a4b41..f0b74a3a 100644
--- a/src/_mock/departments.js
+++ b/src/_mock/departments.js
@@ -21,19 +21,29 @@ export default {
 export const departmentDetailWithAssignedAsset = {
   name: 'Technology',
   id: 2,
-  assets_assigned: [
-    {
-      uuid: 'cde76cd9-3161-43a5-b0be-c20d44d5ba49',
-      asset_category: 'Electronics',
-      serial_number: 'SERIAL-NUMBERS',
-      asset_code: 'TAGTAGTAG',
-      asset_type: 'Monitors'
-    }
-  ]
+  assets_assigned: {
+    count: 0,
+    next: null,
+    previous: null,
+    results: [
+      {
+        uuid: 'cde76cd9-3161-43a5-b0be-c20d44d5ba49',
+        asset_category: 'Electronics',
+        serial_number: 'SERIAL-NUMBERS',
+        asset_code: 'TAGTAGTAG',
+        asset_type: 'Monitors'
+      }
+    ]
+  }
 };
 
 export const departmentDetailWithoutAssignedAsset = {
   name: 'Travel',
   id: 3,
-  assets_assigned: []
+  assets_assigned: {
+    count: 0,
+    next: null,
+    previous: null,
+    results: []
+  }
 };
diff --git a/src/components/Departments/DepartmentDetailComponent.jsx b/src/components/Departments/DepartmentDetailComponent.jsx
index 198f940c..3158fc04 100644
--- a/src/components/Departments/DepartmentDetailComponent.jsx
+++ b/src/components/Departments/DepartmentDetailComponent.jsx
@@ -15,11 +15,11 @@ export class DepartmentDetailComponent extends React.Component {
   }
 
   getAssignedAssets = assets =>
-    this.props.getAssetsSuccess({ results: assets.assets_assigned, count: assets.assets_assigned.length }, '');
+    this.props.getAssetsSuccess({ results: assets.assets_assigned.results, count: assets.assets_assigned.count }, '');
 
 
   assetsAssigned = (assets) => {
-    if (isEmpty(assets.assets_assigned)) {
+    if (isEmpty(assets.assets_assigned.results)) {
       return (
         <Card>
           <Card.Content extra>
@@ -38,6 +38,8 @@ export class DepartmentDetailComponent extends React.Component {
 
   render() {
     const { isLoading, details } = this.props;
+    // eslint-disable-next-line camelcase
+    const { name, assets_assigned } = details;
     if (isLoading) {
       return (
         <LoaderComponent />
@@ -67,10 +69,10 @@ export class DepartmentDetailComponent extends React.Component {
             <Grid columns={3} relaxed="very" stackable>
               <Grid.Column>
                 <Header>
-                  Department Name: {details.name || 'Not Provided'}
+                  Department Name: {name || 'Not Provided'}
                 </Header>
                 <Header>
-                  Total Assets Assigned: {details.assets_assigned.length}
+                  Total Assets Assigned: {assets_assigned.count}
                 </Header>
                 {this.assetsAssigned(details)}
               </Grid.Column>