diff --git a/html/app.css b/html/app.css
index 3ccb1718..f809b428 100644
--- a/html/app.css
+++ b/html/app.css
@@ -303,14 +303,14 @@ a {
 	background: #67C23A;
 }
 
-.x-friend-item>.avatar.inactive::after {
-	background: #FD9200;
-}
-
 .x-friend-item>.avatar.joinme::after {
 	background: #409EFF;
 }
 
+.x-friend-item>.avatar.askme::after {
+	background: #FD9200;
+}
+
 .x-friend-item>.avatar.busy::after {
 	background: #F56C6C;
 }
@@ -374,14 +374,14 @@ i.x-user-status.active {
 	background: #67C23A;
 }
 
-i.x-user-status.inactive {
-	background: #FD9200;
-}
-
 i.x-user-status.joinme {
 	background: #409EFF;
 }
 
+i.x-user-status.askme {
+	background: #FD9200;
+}
+
 i.x-user-status.busy {
 	background: #F56C6C;
 }
diff --git a/html/app.dark.css b/html/app.dark.css
index 24fc1b44..25c3fd14 100644
--- a/html/app.dark.css
+++ b/html/app.dark.css
@@ -278,7 +278,7 @@ For a copy, see <https://opensource.org/licenses/MIT>.
 	background: #3e3e3e;
 }
 
-.x-friend-item>.avatar.active::after, .x-friend-item>.avatar.joinme::after, .x-friend-item>.avatar.busy::after {
+.x-friend-item>.avatar.active::after, .x-friend-item>.avatar.joinme::after, .x-friend-item>.avatar.askme::after, .x-friend-item>.avatar.busy::after {
 	border: 2px solid #000;
 }
 
diff --git a/html/app.js b/html/app.js
index 8e4b3ed6..1c62a33c 100644
--- a/html/app.js
+++ b/html/app.js
@@ -1098,7 +1098,7 @@ CefSharp.BindObjectAsync(
 
 	/*
 		params: {
-			status: string ('active', 'join me', 'busy', 'offline'),
+			status: string ('active', 'offline', 'busy', 'ask me', 'join me'),
 			statusDescription: string
 		}
 	*/
@@ -3756,17 +3756,20 @@ CefSharp.BindObjectAsync(
 	$app.methods.userStatusClass = function (user) {
 		var style = {};
 		if (user !== undefined) {
-			// due to social status, check if the user isn't currentUser
-			if (user.state === 'active' &&
-				user.id !== API.currentUser.id) {
-				style.inactive = true;
-			} else if (user.location === 'offline') {
+			if (user.location === 'offline') {
+				// Offline
 				style.offline = true;
 			} else if (user.status === 'active') {
+				// Online
 				style.active = true;
 			} else if (user.status === 'join me') {
+				// Join Me
 				style.joinme = true;
+			} else if (user.status === 'ask me') {
+				// Ask Me
+				style.askme = true;
 			} else if (user.status === 'busy') {
+				// Do Not Disturb
 				style.busy = true;
 			}
 		}
diff --git a/html/index.html b/html/index.html
index eda76b64..7047535f 100644
--- a/html/index.html
+++ b/html/index.html
@@ -128,9 +128,10 @@
 						<template v-else-if="scope.row.type === 'Status'">
 							<el-tooltip placement="top">
 								<template #content>
-									<span v-if="scope.row.status[1].status === 'active'">Active</span>
+									<span v-if="scope.row.status[1].status === 'active'">Online</span>
 									<span v-else-if="scope.row.status[1].status === 'join me'">Join Me</span>
-									<span v-else-if="scope.row.status[1].status === 'busy'">Busy</span>
+									<span v-else-if="scope.row.status[1].status === 'ask me'">Ask Me</span>
+									<span v-else-if="scope.row.status[1].status === 'busy'">Do Not Disturb</span>
 									<span v-else>Offline</span>
 								</template>
 								<i class="x-user-status" :class="userStatusClass(scope.row.status[1])"></i>
@@ -140,9 +141,10 @@
 							<span><i class="el-icon-right"></i></span>
 							<el-tooltip placement="top">
 								<template #content>
-									<span v-if="scope.row.status[0].status === 'active'">Active</span>
+									<span v-if="scope.row.status[0].status === 'active'">Online</span>
 									<span v-else-if="scope.row.status[0].status === 'join me'">Join Me</span>
-									<span v-else-if="scope.row.status[0].status === 'busy'">Busy</span>
+									<span v-else-if="scope.row.status[0].status === 'ask me'">Ask Me</span>
+									<span v-else-if="scope.row.status[0].status === 'busy'">Do Not Disturb</span>
 									<span v-else>Offline</span>
 								</template>
 								<i class="x-user-status" :class="userStatusClass(scope.row.status[0])"></i>
@@ -179,9 +181,10 @@
 					<template v-else-if="scope.row.type === 'Status'">
 						<el-tooltip placement="top">
 							<template #content>
-								<span v-if="scope.row.status[0].status === 'active'">Active</span>
+								<span v-if="scope.row.status[0].status === 'active'">Online</span>
 								<span v-else-if="scope.row.status[0].status === 'join me'">Join Me</span>
-								<span v-else-if="scope.row.status[0].status === 'busy'">Busy</span>
+								<span v-else-if="scope.row.status[0].status === 'ask me'">Ask Me</span>
+								<span v-else-if="scope.row.status[0].status === 'busy'">Do Not Disturb</span>
 								<span v-else>Offline</span>
 							</template>
 							<i class="x-user-status" :class="userStatusClass(scope.row.status[0])"></i>
@@ -585,9 +588,10 @@
 						<span class="extra">
 							<el-tooltip placement="top">
 								<template #content>
-									<span v-if="API.currentUser.status === 'active'">Active</span>
+									<span v-if="API.currentUser.status === 'active'">Online</span>
 									<span v-else-if="API.currentUser.status === 'join me'">Join Me</span>
-									<span v-else-if="API.currentUser.status === 'busy'">Busy</span>
+									<span v-else-if="API.currentUser.status === 'ask me'">Ask Me</span>
+									<span v-else-if="API.currentUser.status === 'busy'">Do Not Disturb</span>
 									<span v-else>Offline</span>
 								</template>
 								<i class="x-user-status" :class="userStatusClass(API.currentUser)"></i>
@@ -884,11 +888,11 @@
 						<div>
 							<el-tooltip v-if="userDialog.ref.status" placement="top">
 								<template #content>
-									<span v-if="userDialog.ref.state === 'active'">Active</span>
-									<span v-else-if="userDialog.ref.location === 'offline'">Offline</span>
-									<span v-else-if="userDialog.ref.status === 'active'">Active</span>
+									<span v-if="userDialog.ref.location === 'offline'">Offline</span>
+									<span v-else-if="userDialog.ref.status === 'active'">Online</span>
 									<span v-else-if="userDialog.ref.status === 'join me'">Join Me</span>
-									<span v-else-if="userDialog.ref.status === 'busy'">Busy</span>
+									<span v-else-if="userDialog.ref.status === 'ask me'">Ask Me</span>
+									<span v-else-if="userDialog.ref.status === 'busy'">Do Not Disturb</span>
 									<span v-else>Offline</span>
 								</template>
 								<i class="x-user-status" :class="userStatusClass(userDialog.ref)"></i>
@@ -1367,14 +1371,17 @@
 		<el-row v-loading="socialStatusDialog.loading">
 			<el-col :span="9">
 				<el-select v-model="socialStatusDialog.status">
-					<el-option label="Active" value="active">
-						<i class="x-user-status active"></i> Active
+					<el-option label="Online" value="active">
+						<i class="x-user-status active"></i> Online
 					</el-option>
 					<el-option label="Join Me" value="join me">
 						<i class="x-user-status joinme"></i> Join Me
 					</el-option>
+					<el-option label="Ask Me" value="ask me">
+						<i class="x-user-status askme"></i> Ask Me
+					</el-option>
 					<el-option label="Busy" value="busy">
-						<i class="x-user-status busy"></i> Busy
+						<i class="x-user-status busy"></i> Do Not Disturb
 					</el-option>
 					<el-option label="Offline" value="offline">
 						<i class="x-user-status offline"></i> Offline