From afcba2fc891dc23e77ff2c2d6c7cc43e930be01e Mon Sep 17 00:00:00 2001 From: Sowmiya Ravikumar Date: Sun, 13 Oct 2019 15:44:51 +0530 Subject: [PATCH 1/5] refactored badges to use overmind refactored the badges index.js file to use overmind and added named export instead of default export --- .../Modals/PreferencesModal/Badges/index.js | 24 ++++++++++++------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js index b31fbcfdb7f..1ff87e5c44a 100644 --- a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js +++ b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js @@ -1,28 +1,35 @@ -import React from 'react'; -import { inject, observer } from 'app/componentConnectors'; +import React, {FunctionComponent} from 'react'; +import { useOvermind } from 'app/overmind'; import Margin from '@codesandbox/common/lib/components/spacing/Margin'; import Badge from '@codesandbox/common/lib/utils/badges/Badge'; import { Title } from '../elements'; -function BadgesComponent({ store, signals }) { - const badgesCount = store.user.badges.length; +export const BadgesComponent: React.FunctionComponent = () => { + const { + state: { + user: {badges}, + }, + actions: { + preferences: {setBadgeVisibility}, + }, + } = useOvermind(); return (
Badges - You currently have {badgesCount} badge - {badgesCount === 1 ? '' : 's'}. You can click on the badges to toggle + You currently have {badges.badgesCount} badge + {badges.badgesCount === 1 ? '' : 's'}. You can click on the badges to toggle visibility. - {store.user.badges.map(badge => ( + {badges.map(badge => ( - signals.preferences.setBadgeVisibility({ + setBadgeVisibility({ ...b, visible: !b.visible, }) @@ -37,4 +44,3 @@ function BadgesComponent({ store, signals }) { ); } -export const Badges = inject('store', 'signals')(observer(BadgesComponent)); From 0f5f6cf80648f6b0fd7144af2c8d37d472c78c9c Mon Sep 17 00:00:00 2001 From: Sara Vieira Date: Sat, 19 Oct 2019 23:16:01 +0200 Subject: [PATCH 2/5] Update index.js --- .../app/pages/common/Modals/PreferencesModal/Badges/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js index 1ff87e5c44a..e525a2ca103 100644 --- a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js +++ b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js @@ -5,7 +5,7 @@ import Margin from '@codesandbox/common/lib/components/spacing/Margin'; import Badge from '@codesandbox/common/lib/utils/badges/Badge'; import { Title } from '../elements'; -export const BadgesComponent: React.FunctionComponent = () => { +export const BadgesComponent: FunctionComponent = () => { const { state: { user: {badges}, From 853ff6f616abc94eb7497a8192ee563d3bcd38fc Mon Sep 17 00:00:00 2001 From: Sara Vieira Date: Sat, 19 Oct 2019 23:16:16 +0200 Subject: [PATCH 3/5] Rename index.js to index.tsx --- .../common/Modals/PreferencesModal/Badges/{index.js => index.tsx} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/{index.js => index.tsx} (100%) diff --git a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx similarity index 100% rename from packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.js rename to packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx From 337f2c7c26d91e2cda3b716485d23182cd033900 Mon Sep 17 00:00:00 2001 From: Sara Vieira Date: Sat, 19 Oct 2019 23:18:06 +0200 Subject: [PATCH 4/5] Update index.tsx --- .../pages/common/Modals/PreferencesModal/Badges/index.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx index e525a2ca103..7d3b7b58315 100644 --- a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx +++ b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx @@ -14,13 +14,14 @@ export const BadgesComponent: FunctionComponent = () => { preferences: {setBadgeVisibility}, }, } = useOvermind(); + const badgesCount = badges.length; return (
Badges - You currently have {badges.badgesCount} badge - {badges.badgesCount === 1 ? '' : 's'}. You can click on the badges to toggle + You currently have {badgesCount} badge + {badgesCount === 1 ? '' : 's'}. You can click on the badges to toggle visibility. From ad14ff43180e218ced7d5185c0112023dd164fbd Mon Sep 17 00:00:00 2001 From: Sara Vieira Date: Sat, 19 Oct 2019 23:22:02 +0200 Subject: [PATCH 5/5] Update index.tsx --- .../app/pages/common/Modals/PreferencesModal/Badges/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx index 7d3b7b58315..d6c5fb8cef8 100644 --- a/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx +++ b/packages/app/src/app/pages/common/Modals/PreferencesModal/Badges/index.tsx @@ -5,7 +5,7 @@ import Margin from '@codesandbox/common/lib/components/spacing/Margin'; import Badge from '@codesandbox/common/lib/utils/badges/Badge'; import { Title } from '../elements'; -export const BadgesComponent: FunctionComponent = () => { +export const Badges: FunctionComponent = () => { const { state: { user: {badges},