Cherry picking refactored fb.js from #879 by @AndrewBastin (#1286)

* Cherry picking refactored fb.js from #879 by @AndrewBastin

* Fixed a minor UI glitch in History section

* Removed logout success toast testcase

Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>

components/firebase/__tests__/logout.spec.js

@@ -0,0 +1,66 @@
+import logout from "../logout"
+import { shallowMount, createLocalVue } from "@vue/test-utils"
+
+jest.mock("~/helpers/fb", () => {
+  return {
+    __esModule: true,
+    fb: {
+      signOutUser: jest.fn(() => Promise.resolve()),
+    },
+  }
+})
+
+const { fb } = require("~/helpers/fb")
+
+const $toast = {
+  info: jest.fn(),
+  show: jest.fn(),
+}
+
+const localVue = createLocalVue()
+
+localVue.directive("close-popover", {})
+
+const factory = () =>
+  shallowMount(logout, {
+    mocks: {
+      $t: (text) => text,
+      $toast,
+    },
+    localVue,
+  })
+
+beforeEach(() => {
+  fb.signOutUser.mockClear()
+  $toast.info.mockClear()
+  $toast.show.mockClear()
+})
+
+describe("logout", () => {
+  test("mounts properly", () => {
+    const wrapper = factory()
+
+    expect(wrapper).toBeTruthy()
+  })
+
+  test("clicking the logout button fires the logout firebase function", async () => {
+    const wrapper = factory()
+
+    const button = wrapper.find("button")
+
+    await button.trigger("click")
+
+    expect(fb.signOutUser).toHaveBeenCalledTimes(1)
+  })
+
+  test("failed signout request fires a error toast", async () => {
+    fb.signOutUser.mockImplementationOnce(() => Promise.reject("test reject"))
+
+    const wrapper = factory()
+    const button = wrapper.find("button")
+    await button.trigger("click")
+
+    expect($toast.show).toHaveBeenCalledTimes(1)
+    expect($toast.show).toHaveBeenCalledWith("test reject", expect.anything())
+  })
+})