@mohamed-karawia/library 0.1.21 → 0.1.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dist/stories/Chat/Chat.js +24 -31
  2. package/dist/stories/Community/Community.js +37 -15
  3. package/dist/stories/Events/Event/Event.js +12 -4
  4. package/dist/stories/Events/EventsList/EventsList.js +14 -7
  5. package/dist/stories/Library/Folders/Folders.js +27 -17
  6. package/dist/stories/Library/Notes/Notes.js +29 -18
  7. package/dist/stories/Music Album/ViewAlbum/ViewAlbum.js +8 -44
  8. package/dist/stories/Music Album/ViewAlbums/ViewAlbums.js +57 -37
  9. package/dist/stories/Photo Album/ViewAlbum/ViewAlbum.js +26 -16
  10. package/dist/stories/Photo Album/ViewAlbums/ViewAlbums.js +11 -4
  11. package/dist/stories/PreviewComponents/ChatPreview/ChatPreview.js +1 -1
  12. package/dist/stories/PreviewComponents/EventPreview/EventPreview.js +1 -1
  13. package/dist/stories/PreviewComponents/EventsPreview/EventsPreview.js +1 -1
  14. package/dist/stories/PreviewComponents/FoldersPreview/FoldersPreview.js +1 -1
  15. package/dist/stories/PreviewComponents/MusicAlbumsPreview/MusicAlbumsPreview.js +1 -1
  16. package/dist/stories/PreviewComponents/MusicPlayerPreview/MusicPlayerPreview.js +1 -1
  17. package/dist/stories/PreviewComponents/NavbarPreview/NavbarPreview.js +1 -1
  18. package/dist/stories/PreviewComponents/NotesPreview/NotesPreview.js +1 -1
  19. package/dist/stories/PreviewComponents/PhotoAlbumPreview/PhotoAlbumPreview.js +1 -1
  20. package/dist/stories/PreviewComponents/PhotoAlbumsPreview/PhotoAlbumsPreview.js +1 -1
  21. package/dist/stories/PreviewComponents/SpacesListPreview/SpacesListPreview.js +1 -1
  22. package/dist/stories/PreviewComponents/VideoAlbumPreview/VideoAlbumPreview.js +1 -1
  23. package/dist/stories/PreviewComponents/VideoAlbumsPreview/VideoAlbumsPreview.js +1 -1
  24. package/dist/stories/PreviewComponents/VideoPreview/VideoPreview.js +1 -1
  25. package/dist/stories/Reusable Components/Community/Community.js +12 -34
  26. package/dist/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.js +11 -4
  27. package/dist/stories/VideoAlbum/VideoSpace/VideoSpace.js +17 -6
  28. package/dist/stories/VideoAlbum/ViewAlbum/ViewAlbum.js +24 -25
  29. package/dist/stories/store/communities.js +27 -29
  30. package/package.json +1 -1
  31. package/src/stories/Chat/Chat.jsx +25 -19
  32. package/src/stories/Community/Community.jsx +14 -15
  33. package/src/stories/Events/Event/Event.jsx +11 -3
  34. package/src/stories/Events/EventsList/EventsList.jsx +11 -4
  35. package/src/stories/Library/Folders/Folders.jsx +23 -14
  36. package/src/stories/Library/Notes/Notes.jsx +25 -15
  37. package/src/stories/Music Album/ViewAlbum/ViewAlbum.jsx +17 -61
  38. package/src/stories/Music Album/ViewAlbums/ViewAlbums.jsx +44 -30
  39. package/src/stories/Photo Album/ViewAlbum/ViewAlbum.jsx +14 -5
  40. package/src/stories/Photo Album/ViewAlbums/ViewAlbums.jsx +10 -3
  41. package/src/stories/PreviewComponents/ChatPreview/ChatPreview.jsx +1 -1
  42. package/src/stories/PreviewComponents/EventPreview/EventPreview.jsx +1 -1
  43. package/src/stories/PreviewComponents/EventsPreview/EventsPreview.jsx +1 -1
  44. package/src/stories/PreviewComponents/FoldersPreview/FoldersPreview.jsx +1 -1
  45. package/src/stories/PreviewComponents/MusicAlbumsPreview/MusicAlbumsPreview.jsx +1 -1
  46. package/src/stories/PreviewComponents/MusicPlayerPreview/MusicPlayerPreview.jsx +1 -1
  47. package/src/stories/PreviewComponents/NavbarPreview/NavbarPreview.jsx +1 -1
  48. package/src/stories/PreviewComponents/NotesPreview/NotesPreview.jsx +1 -1
  49. package/src/stories/PreviewComponents/PhotoAlbumPreview/PhotoAlbumPreview.jsx +1 -1
  50. package/src/stories/PreviewComponents/PhotoAlbumsPreview/PhotoAlbumsPreview.jsx +1 -1
  51. package/src/stories/PreviewComponents/SpacesListPreview/SpacesListPreview.jsx +1 -1
  52. package/src/stories/PreviewComponents/VideoAlbumPreview/VideoAlbumPreview.jsx +1 -1
  53. package/src/stories/PreviewComponents/VideoAlbumsPreview/VideoAlbumsPreview.jsx +1 -1
  54. package/src/stories/PreviewComponents/VideoPreview/VideoPreview.jsx +1 -1
  55. package/src/stories/Reusable Components/Community/Community.jsx +10 -33
  56. package/src/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.jsx +10 -3
  57. package/src/stories/VideoAlbum/VideoSpace/VideoSpace.jsx +10 -3
  58. package/src/stories/VideoAlbum/ViewAlbum/ViewAlbum.jsx +30 -34
  59. package/src/stories/store/communities.js +27 -29
@@ -37,7 +37,7 @@ var _bs = require("react-icons/bs");
37
37
 
38
38
  var _templateObject;
39
39
 
40
- var _excluded = ["album", "cardBackgroundColor", "cardTitleColor", "cardTitleFontSize", "descColor"];
40
+ var _excluded = ["album", "cardBackgroundColor", "cardTitleColor", "cardTitleFontSize", "descColor", "community"];
41
41
 
42
42
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
43
43
 
@@ -68,6 +68,7 @@ var ViewAlbum = function ViewAlbum(_ref) {
68
68
  cardTitleColor = _ref.cardTitleColor,
69
69
  cardTitleFontSize = _ref.cardTitleFontSize,
70
70
  descColor = _ref.descColor,
71
+ community = _ref.community,
71
72
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
72
73
 
73
74
  var _useState = (0, _react.useState)(false),
@@ -81,6 +82,7 @@ var ViewAlbum = function ViewAlbum(_ref) {
81
82
  setShowConfigModal = _useState4[1];
82
83
 
83
84
  var _useState5 = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(ViewAlbum, {
85
+ preview: true,
84
86
  album: album
85
87
  })),
86
88
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
@@ -90,6 +92,7 @@ var ViewAlbum = function ViewAlbum(_ref) {
90
92
  var formChanged = function formChanged(values) {
91
93
  console.log('context changed');
92
94
  setCenterContext( /*#__PURE__*/_react.default.createElement(ViewAlbum, Object.assign({
95
+ preview: true,
93
96
  album: album
94
97
  }, values)));
95
98
  };
@@ -101,16 +104,6 @@ var ViewAlbum = function ViewAlbum(_ref) {
101
104
  title: 'Context',
102
105
  id: 'community'
103
106
  }];
104
- var sections = [{
105
- title: 'Styles',
106
- data: [{
107
- title: 'Styling',
108
- component: /*#__PURE__*/_react.default.createElement(_Tabs.default, {
109
- title: "Video Album Config",
110
- tabs: tabs
111
- })
112
- }]
113
- }];
114
107
  var cardStyles = {
115
108
  darkOnHover: true,
116
109
  cardBackgroundColor: cardBackgroundColor,
@@ -132,17 +125,19 @@ var ViewAlbum = function ViewAlbum(_ref) {
132
125
  };
133
126
 
134
127
  var onHeaderIconClicked = function onHeaderIconClicked(action) {
135
- switch (action) {
136
- case 'add':
137
- setShowModal(true);
138
- break;
139
-
140
- case 'config':
141
- setShowConfigModal(true);
142
- break;
143
-
144
- default:
145
- break;
128
+ if (!props.preview) {
129
+ switch (action) {
130
+ case 'add':
131
+ setShowModal(true);
132
+ break;
133
+
134
+ case 'config':
135
+ setShowConfigModal(true);
136
+ break;
137
+
138
+ default:
139
+ break;
140
+ }
146
141
  }
147
142
  };
148
143
 
@@ -159,6 +154,11 @@ var ViewAlbum = function ViewAlbum(_ref) {
159
154
  setShowModal(false);
160
155
  };
161
156
 
157
+ var cancelConfig = function cancelConfig() {
158
+ setShowConfigModal(false);
159
+ localStorage.removeItem('formStyles');
160
+ };
161
+
162
162
  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(_Gallery.default, Object.assign({
163
163
  galleryTitle: props.title || "Video Album",
164
164
  data: album,
@@ -182,9 +182,7 @@ var ViewAlbum = function ViewAlbum(_ref) {
182
182
  cancelHandler: cancelHandler
183
183
  })), /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
184
184
  modalIsOpen: showConfigModal,
185
- closeModal: function closeModal() {
186
- return setShowConfigModal(false);
187
- },
185
+ closeModal: cancelConfig,
188
186
  exitModalButton: function exitModalButton(e) {
189
187
  return /*#__PURE__*/_react.default.createElement("div", null);
190
188
  }
@@ -201,6 +199,7 @@ var ViewAlbum = function ViewAlbum(_ref) {
201
199
  id: "preview"
202
200
  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
203
201
  center: centerContext,
202
+ community: community,
204
203
  id: "community"
205
204
  }))));
206
205
  };
@@ -81,35 +81,33 @@ var community = {
81
81
  }]
82
82
  }],
83
83
  styles: {
84
- header: {},
85
- body: {
86
- sectionHeaderStyles: {
87
- padding: 2,
88
- headerBackground: "#00ADC4",
89
- titleColor: "white"
90
- },
91
- customCardStyles: {
92
- cardPadding: 6,
93
- cardTitleFontSize: 15,
94
- cardBackgroundColor: "white",
95
- cardTitleColor: "#00ADC4",
96
- cardBorderSize: 1,
97
- cardBorderColor: "#00ADC4",
98
- onHoverBackgroundColor: "#d3d3d3",
99
- controlsStyles: {
100
- showOnHover: true,
101
- iconColor: "#00ADC4"
102
- }
103
- },
104
- borderRadius: 10,
105
- primaryColor: "#00ADC4",
106
- iconsColor: "#00ADC4",
107
- backgroundColor: "white",
108
- discColor: "gray",
109
- dateColor: "gray",
110
- iconColor: "#00ADC4",
111
- cardTitleFontSize: 15
112
- }
84
+ headerStyles: {},
85
+ sectionHeaderStyles: {
86
+ padding: 2,
87
+ headerBackground: "#00ADC4",
88
+ titleColor: "white"
89
+ },
90
+ customCardStyles: {
91
+ cardPadding: 6,
92
+ cardTitleFontSize: 15,
93
+ cardBackgroundColor: "white",
94
+ cardTitleColor: "#00ADC4",
95
+ cardBorderSize: 1,
96
+ cardBorderColor: "#00ADC4",
97
+ onHoverBackgroundColor: "#d3d3d3",
98
+ controlsStyles: {
99
+ showOnHover: true,
100
+ iconColor: "#00ADC4"
101
+ }
102
+ },
103
+ borderRadius: 10,
104
+ primaryColor: "#00ADC4",
105
+ iconsColor: "#00ADC4",
106
+ backgroundColor: "white",
107
+ discColor: "gray",
108
+ dateColor: "gray",
109
+ iconColor: "#00ADC4",
110
+ cardTitleFontSize: 15
113
111
  }
114
112
  }
115
113
  },
package/package.json CHANGED
@@ -10,7 +10,7 @@
10
10
  ]
11
11
  ]
12
12
  },
13
- "version": "0.1.21",
13
+ "version": "0.1.22",
14
14
  "private": false,
15
15
  "dependencies": {
16
16
  "@babel/cli": "^7.16.7",
@@ -24,14 +24,14 @@ const Chat = ({
24
24
  users,
25
25
  title,
26
26
  backgroundColor,
27
+ community,
27
28
  ...props }) => {
28
29
 
29
30
  const [showConfigModal, setShowConfigModal] = useState(false);
30
- const [centerContext, setCenterContext] = useState(<Chat users={users} data={data}/>)
31
+ const [centerContext, setCenterContext] = useState(<Chat preview={true} users={users} data={data}/>)
31
32
 
32
33
  const formChanged = (values) => {
33
- console.log('context changed')
34
- setCenterContext(<Chat users={users} data={data} {...values} />)
34
+ setCenterContext(<Chat preview={true} users={users} data={data} {...values} />)
35
35
  }
36
36
 
37
37
  let tabs = [
@@ -43,17 +43,17 @@ const Chat = ({
43
43
  }
44
44
  ]
45
45
 
46
- let sections = [
47
- {
48
- title: 'Styles',
49
- data: [
50
- {
51
- title: 'Styling',
52
- id: 'styling'
53
- }
54
- ]
55
- }
56
- ]
46
+ // let sections = [
47
+ // {
48
+ // title: 'Styles',
49
+ // data: [
50
+ // {
51
+ // title: 'Styling',
52
+ // id: 'styling'
53
+ // }
54
+ // ]
55
+ // }
56
+ // ]
57
57
 
58
58
  const onIconClicked = (action) => {
59
59
  if (!props.preview) {
@@ -67,6 +67,11 @@ const Chat = ({
67
67
  }
68
68
  }
69
69
 
70
+ const cancelConfig = () => {
71
+ setShowConfigModal(false);
72
+ localStorage.removeItem('formStyles')
73
+ }
74
+
70
75
  return (
71
76
  <Container
72
77
  backgroundColor={backgroundColor}>
@@ -84,12 +89,12 @@ const Chat = ({
84
89
  />
85
90
  <Modal
86
91
  modalIsOpen={showConfigModal}
87
- closeModal={() => setShowConfigModal(false)}
92
+ closeModal={cancelConfig}
88
93
  exitModalButton={(e) => (
89
94
  <div></div>
90
- )}
95
+ )} preview={true}
91
96
  >
92
- <Sections
97
+ {/* <Sections
93
98
  sections={sections}
94
99
  backgroundColor={'white'}
95
100
  sectionHeaderStyles={{
@@ -105,7 +110,7 @@ const Chat = ({
105
110
  controlsStyles: {
106
111
  showOnHover: true,
107
112
  }
108
- }}>
113
+ }}> */}
109
114
  <Tabs
110
115
  title="Chat Config"
111
116
  tabs={tabs}
@@ -118,9 +123,10 @@ const Chat = ({
118
123
  />
119
124
  <Community
120
125
  center={centerContext}
126
+ community={community}
121
127
  id="community" />
122
128
  </Tabs>
123
- </Sections>
129
+ {/* </Sections> */}
124
130
  </Modal>
125
131
  </Container>
126
132
  )
@@ -37,7 +37,7 @@ const Community = (props) => {
37
37
  dispatch(addEvent(event))
38
38
  }
39
39
 
40
- console.log(space)
40
+ console.log(community)
41
41
 
42
42
  const eventIconClicked = (action, index) => {
43
43
  switch (action) {
@@ -66,26 +66,25 @@ const Community = (props) => {
66
66
  listTitle: spacesWidget.listTitle,
67
67
  spaces: spacesWidget.spaces,
68
68
  cardClicked: switchSpace,
69
- headerStyles: spacesWidget.styles.header,
70
- ...spacesWidget.styles.body
69
+ ...spacesWidget.styles
71
70
  }}
72
71
  />
73
72
  </Left>
74
73
  <Center>
75
74
  {
76
75
  {
77
- 'chat': <Chat {...space.spaceProps} {...space.styles} />,
78
- 'event': <Event {...space.spaceProps} {...space.styles} />,
79
- 'events_list': <EventsList cardIconClicked={eventIconClicked} onAddEvent={onAddEvent} {...space.spaceProps} {...space.styles} />,
80
- 'folders': <Folders {...space.spaceProps} {...space.styles} />,
81
- 'notes': <Notes {...space.spaceProps} {...space.styles} />,
82
- 'music_album': <MusicAlbum {...space.spaceProps} {...space.styles} />,
83
- 'music_albums': <MusicAlbums {...space.spaceProps} {...space.styles} />,
84
- 'photo_album': <PhotoAlbum {...space.spaceProps} {...space.styles}/>,
85
- 'photo_albums': <PhotoAlbums {...space.spaceProps} {...space.styles}/>,
86
- 'video_albums': <VideoAlbums {...space.spaceProps} {...space.styles}/>,
87
- 'video_album': <VideoAlbum {...space.spaceProps} {...space.styles}/>,
88
- 'video_space': <VideoSpace {...space.spaceProps} {...space.styles}/>
76
+ 'chat': <Chat community={community} {...space.spaceProps} {...space.styles} />,
77
+ 'event': <Event community={community} {...space.spaceProps} {...space.styles} />,
78
+ 'events_list': <EventsList community={community} cardIconClicked={eventIconClicked} onAddEvent={onAddEvent} {...space.spaceProps} {...space.styles} />,
79
+ 'folders': <Folders community={community} {...space.spaceProps} {...space.styles} />,
80
+ 'notes': <Notes community={community} {...space.spaceProps} {...space.styles} />,
81
+ 'music_album': <MusicAlbum community={community} {...space.spaceProps} {...space.styles} />,
82
+ 'music_albums': <MusicAlbums community={community} {...space.spaceProps} {...space.styles} />,
83
+ 'photo_album': <PhotoAlbum community={community} {...space.spaceProps} {...space.styles}/>,
84
+ 'photo_albums': <PhotoAlbums community={community} {...space.spaceProps} {...space.styles}/>,
85
+ 'video_albums': <VideoAlbums community={community} {...space.spaceProps} {...space.styles}/>,
86
+ 'video_album': <VideoAlbum community={community} {...space.spaceProps} {...space.styles}/>,
87
+ 'video_space': <VideoSpace community={community} {...space.spaceProps} {...space.styles}/>
89
88
 
90
89
  }[spaceType]
91
90
  }
@@ -30,13 +30,14 @@ const Event = ({
30
30
  discColor,
31
31
  discSize,
32
32
  headerStyles,
33
+ community,
33
34
  ...props
34
35
  }) => {
35
36
  const [showConfigModal, setShowConfigModal] = useState(false);
36
- const [centerContext, setCenterContext] = useState(<Event title={title} cover={cover} date={date} disc={disc}/>)
37
+ const [centerContext, setCenterContext] = useState(<Event preview={true} title={title} cover={cover} date={date} disc={disc}/>)
37
38
 
38
39
  const formChanged = (values) => {
39
- setCenterContext(<Event title={title} cover={cover} date={date} disc={disc} {...values} />)
40
+ setCenterContext(<Event preview={true} title={title} cover={cover} date={date} disc={disc} {...values} />)
40
41
  }
41
42
 
42
43
  let tabs = [
@@ -71,6 +72,12 @@ const Event = ({
71
72
  }
72
73
  }
73
74
  }
75
+
76
+ const cancelConfig = () => {
77
+ setShowConfigModal(false);
78
+ localStorage.removeItem('formStyles')
79
+ }
80
+
74
81
  return (
75
82
  <Container
76
83
  backgroundColor={backgroundColor}>
@@ -97,7 +104,7 @@ const Event = ({
97
104
  </Details>
98
105
  <Modal
99
106
  modalIsOpen={showConfigModal}
100
- closeModal={() => setShowConfigModal(false)}
107
+ closeModal={cancelConfig}
101
108
  exitModalButton={(e) => (
102
109
  <div></div>
103
110
  )}
@@ -130,6 +137,7 @@ const Event = ({
130
137
  />
131
138
  <Community
132
139
  center={centerContext}
140
+ community={community} preview={true}
133
141
  id="community" />
134
142
  </Tabs>
135
143
  </Modal>
@@ -25,15 +25,16 @@ const cardControls = [
25
25
 
26
26
  const EventsList = ({
27
27
  events,
28
+ community,
28
29
  ...props
29
30
  }) => {
30
31
 
31
32
  const [showModal, setShowModal] = useState(false);
32
33
  const [showConfigModal, setShowConfigModal] = useState(false);
33
- const [centerContext, setCenterContext] = useState(<EventsList events={events} />)
34
+ const [centerContext, setCenterContext] = useState(<EventsList preview={true} events={events} {...props}/>)
34
35
 
35
36
  const formChanged = (values) => {
36
- setCenterContext(<EventsList events={events} {...values} />)
37
+ setCenterContext(<EventsList preview={true} events={events} {...values} />)
37
38
  }
38
39
 
39
40
  let tabs = [
@@ -93,6 +94,11 @@ const EventsList = ({
93
94
  props.onAddEvent(event)
94
95
  }
95
96
 
97
+ const cancelConfig = () => {
98
+ setShowConfigModal(false);
99
+ localStorage.removeItem('formStyles')
100
+ }
101
+
96
102
  return (
97
103
  <Container>
98
104
  <List
@@ -122,7 +128,7 @@ const EventsList = ({
122
128
  </Modal>
123
129
  <Modal
124
130
  modalIsOpen={showConfigModal}
125
- closeModal={() => setShowConfigModal(false)}
131
+ closeModal={cancelConfig}
126
132
  exitModalButton={(e) => (
127
133
  <div></div>
128
134
  )}
@@ -145,7 +151,7 @@ const EventsList = ({
145
151
  }
146
152
  }} /> */}
147
153
  <Tabs
148
- title="Event Config"
154
+ title="Events Config"
149
155
  tabs={tabs}>
150
156
  <EventsPreview
151
157
  componentProps={{ events, title: props.title || "My Events", preview: true }}
@@ -154,6 +160,7 @@ const EventsList = ({
154
160
  />
155
161
  <Community
156
162
  center={centerContext}
163
+ community={community}
157
164
  id="community" />
158
165
  </Tabs>
159
166
  </Modal>
@@ -31,14 +31,15 @@ const Folders = ({
31
31
  rowGap,
32
32
  cardClicked,
33
33
  iconColor,
34
+ community,
34
35
  ...props
35
36
  }) => {
36
37
  const [showModal, setShowModal] = useState(false);
37
38
  const [showConfigModal, setShowConfigModal] = useState(false);
38
- const [centerContext, setCenterContext] = useState(<Folders folders={folders} />)
39
+ const [centerContext, setCenterContext] = useState(<Folders preview={true} folders={folders} />)
39
40
 
40
41
  const formChanged = (values) => {
41
- setCenterContext(<Folders folders={folders} {...values} />)
42
+ setCenterContext(<Folders preview={true} folders={folders} {...values} />)
42
43
  }
43
44
 
44
45
  let tabs = [
@@ -64,16 +65,23 @@ const Folders = ({
64
65
  }
65
66
  ]
66
67
 
68
+ const cancelConfig = () => {
69
+ setShowConfigModal(false);
70
+ localStorage.removeItem('formStyles')
71
+ }
72
+
67
73
  const onIconClicked = (action) => {
68
- switch (action) {
69
- case 'add':
70
- setShowModal(true)
71
- break;
72
- case 'config':
73
- setShowConfigModal(true)
74
- break;
75
- default:
76
- break;
74
+ if (!props.preview) {
75
+ switch (action) {
76
+ case 'add':
77
+ setShowModal(true)
78
+ break;
79
+ case 'config':
80
+ setShowConfigModal(true)
81
+ break;
82
+ default:
83
+ break;
84
+ }
77
85
  }
78
86
  }
79
87
 
@@ -120,7 +128,7 @@ const Folders = ({
120
128
  </Modal>
121
129
  <Modal
122
130
  modalIsOpen={showConfigModal}
123
- closeModal={() => setShowConfigModal(false)}
131
+ closeModal={cancelConfig}
124
132
  exitModalButton={(e) => (
125
133
  <div></div>
126
134
  )}
@@ -143,15 +151,16 @@ const Folders = ({
143
151
  }
144
152
  }} /> */}
145
153
  <Tabs
146
- title="Event Config"
154
+ title="Folders Config"
147
155
  tabs={tabs}>
148
156
  <FoldersPreview
149
- componentProps={{ folders, title: props.title || "Your Folders" }}
157
+ componentProps={{ folders, title: props.title || "Your Folders", preview: true }}
150
158
  formChanged={formChanged}
151
159
  id='preview'
152
160
  />
153
161
  <Community
154
162
  center={centerContext}
163
+ community={community}
155
164
  id="community" />
156
165
  </Tabs>
157
166
  </Modal>
@@ -27,14 +27,15 @@ const Notes = ({
27
27
  cardTitleFontSize,
28
28
  cardTitleColor,
29
29
  cardPadding,
30
+ community,
30
31
  ...props
31
32
  }) => {
32
33
  const [showModal, setShowModal] = useState(false);
33
34
  const [showConfigModal, setShowConfigModal] = useState(false);
34
- const [centerContext, setCenterContext] = useState(<Notes notes={notes} />)
35
+ const [centerContext, setCenterContext] = useState(<Notes preview={true} notes={notes} />)
35
36
 
36
37
  const formChanged = (values) => {
37
- setCenterContext(<Notes notes={notes} {...values} />)
38
+ setCenterContext(<Notes preview={true} notes={notes} {...values} />)
38
39
  }
39
40
 
40
41
  let tabs = [
@@ -61,15 +62,17 @@ const Notes = ({
61
62
  ]
62
63
 
63
64
  const onIconClicked = (action) => {
64
- switch (action) {
65
- case 'add':
66
- setShowModal(true)
67
- break;
68
- case 'config':
69
- setShowConfigModal(true)
70
- break;
71
- default:
72
- break;
65
+ if (!props.preview) {
66
+ switch (action) {
67
+ case 'add':
68
+ setShowModal(true)
69
+ break;
70
+ case 'config':
71
+ setShowConfigModal(true)
72
+ break;
73
+ default:
74
+ break;
75
+ }
73
76
  }
74
77
  }
75
78
 
@@ -90,6 +93,11 @@ const Notes = ({
90
93
  setShowModal(false)
91
94
  }
92
95
 
96
+ const cancelConfig = () => {
97
+ setShowConfigModal(false);
98
+ localStorage.removeItem('formStyles')
99
+ }
100
+
93
101
  return (
94
102
  <Container>
95
103
  <List
@@ -119,20 +127,22 @@ const Notes = ({
119
127
  </Modal>
120
128
  <Modal
121
129
  modalIsOpen={showConfigModal}
122
- closeModal={() => setShowConfigModal(false)}
130
+ closeModal={cancelConfig}
123
131
  exitModalButton={(e) => (
124
132
  <div></div>
125
133
  )}
126
134
  >
127
135
  <Tabs
128
- title="Event Config"
136
+ title="Notes Config"
129
137
  tabs={tabs}>
130
138
  <NotesPreview
131
- componentProps={{ notes, title: props.title || "Your Notes" }}
132
- formChanged={formChanged }
139
+ componentProps={{ notes, title: props.title || "Your Notes" , preview: true}}
140
+ formChanged={formChanged}
141
+ id="preview"
133
142
  />
134
143
  <Community
135
144
  center={centerContext}
145
+ community={community}
136
146
  id="community" />
137
147
  </Tabs>
138
148
  </Modal>