@mohamed-karawia/library 0.1.5 → 0.1.9
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.
- package/dist/stories/Reusable Components/fakeData.js +24 -4
- package/dist/stories/helpers/util.js +16 -14
- package/package.json +1 -1
- package/src/stories/Reusable Components/fakeData.js +5 -0
- package/src/stories/helpers/util.js +1 -0
- package/.github/workflows/chromatic.yml +0 -26
- package/.storybook/main.js +0 -21
- package/.storybook/middleware.js +0 -28
- package/.storybook/preview.js +0 -9
- package/build-storybook.log +0 -2704
- package/dist/stories/API/API.stories.js +0 -24
- package/dist/stories/Agora/Chat/Chat.stories.js +0 -24
- package/dist/stories/Agora/Room/Room.stories.js +0 -24
- package/dist/stories/Buttons/Buttons/Buttons.stories.js +0 -39
- package/dist/stories/Buttons/ReactModal/ReactModal.stories.js +0 -30
- package/dist/stories/Chat/Chat.stories.js +0 -76
- package/dist/stories/Common Inputs/CheckboxGroup/CheckboxGroup.stories.js +0 -58
- package/dist/stories/Common Inputs/CustomAutoComplete/CustomAutoComplete.stories.js +0 -56
- package/dist/stories/Common Inputs/CustomDropzone/CustomDropzone.stories.js +0 -47
- package/dist/stories/Common Inputs/CustomSelect/CustomSelect.stories.js +0 -61
- package/dist/stories/Common Inputs/CustomTextarea/CustomTextarea.stories.js +0 -48
- package/dist/stories/Common Inputs/DatePicker/DatePicker.stories.js +0 -60
- package/dist/stories/Common Inputs/EditorComponent/EditorComponent.stories.js +0 -62
- package/dist/stories/Common Inputs/Formik/InputField/InputField.stories.js +0 -43
- package/dist/stories/Common Inputs/Formik/RadioField/RadioField.stories.js +0 -60
- package/dist/stories/Common Inputs/RadioInput/RadioInput.stories.js +0 -50
- package/dist/stories/Common Inputs/RichTextInput/RichTextInput.stories.js +0 -51
- package/dist/stories/Common Inputs/TextField/TextField.stories.js +0 -48
- package/dist/stories/Containers/BaseMaterial.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetBody.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetExample.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetHead.stories.js +0 -24
- package/dist/stories/Enrollment/Admin/CreateForm/CreateForm.stories.js +0 -22
- package/dist/stories/Enrollment/Admin/DetailedForm/DetailedForm.stories.js +0 -42
- package/dist/stories/Enrollment/Admin/ViewForms/ViewForms.stories.js +0 -65
- package/dist/stories/Enrollment/Guest/FillForm/FillForm.stories.js +0 -48
- package/dist/stories/Events/CreateEvent/CreateEvent.stories.js +0 -30
- package/dist/stories/Events/Event/Event.stories.js +0 -33
- package/dist/stories/Events/EventsList/EventsList.stories.js +0 -44
- package/dist/stories/Forms/AddPhoto/AddPhoto.stories.js +0 -47
- package/dist/stories/Forms/AddSong/AddSong.stories.js +0 -37
- package/dist/stories/Forms/AddVideo/AddVideo.stories.js +0 -33
- package/dist/stories/Forms/Create-Profile/CreateProfile.stories.js +0 -49
- package/dist/stories/Forms/Create-Profile/subcomponents/LogoUploader.stories.js +0 -42
- package/dist/stories/Forms/Create-Profile/subcomponents/ProfilePhoto.stories.js +0 -41
- package/dist/stories/Forms/Create-Profile/subcomponents/ResetBtn.stories.js +0 -32
- package/dist/stories/Forms/CreateAlbum/CreateAlbum.stories.js +0 -47
- package/dist/stories/Forms/CreateAnnouncementForm/CreateAnnouncementForm.stories.js +0 -58
- package/dist/stories/Forms/CreateMusicAlbum/CreateMusicAlbum.stories.js +0 -47
- package/dist/stories/Forms/CreateProfile/CreateProfile.stories.js +0 -24
- package/dist/stories/Forms/CreateProfile-3/CreateProfile.stories.js +0 -24
- package/dist/stories/Forms/CreateUser/CreateUser.stories.js +0 -26
- package/dist/stories/Forms/CreateVideoAlbum/CreateVideoAlbum.stories.js +0 -37
- package/dist/stories/Forms/Form/Form.stories.js +0 -24
- package/dist/stories/Forms/NewProfile/NewProfile.stories.js +0 -24
- package/dist/stories/Layout/Body/Body.stories.js +0 -30
- package/dist/stories/Layout/Center/Center.stories.js +0 -24
- package/dist/stories/Layout/Head/Head.stories.js +0 -24
- package/dist/stories/Layout/Left/Left.stories.js +0 -24
- package/dist/stories/Layout/Right/Right.stories.js +0 -24
- package/dist/stories/Library/CreateFolder/CreateFolder.stories.js +0 -45
- package/dist/stories/Library/Folders/Folders.stories.js +0 -55
- package/dist/stories/Library/Notes/Notes.stories.js +0 -42
- package/dist/stories/Library/ViewNote/ViewNote.stories.js +0 -24
- package/dist/stories/Music Album/ViewAlbum/ViewAlbum.stories.js +0 -115
- package/dist/stories/Music Album/ViewAlbums/ViewAlbums.stories.js +0 -107
- package/dist/stories/Navbar/Navbar.stories.js +0 -41
- package/dist/stories/Pages/Blank/Blank.stories.js +0 -24
- package/dist/stories/Pages/Centered/Centered.stories.js +0 -24
- package/dist/stories/Pages/Chat/Chat.stories.js +0 -74
- package/dist/stories/Pages/Enrollment/DetailedForm/DetailedForm.stories.js +0 -22
- package/dist/stories/Pages/Enrollment/FillForm/FillForm.stories.js +0 -22
- package/dist/stories/Pages/Enrollment/Forms/Forms.stories.js +0 -22
- package/dist/stories/Pages/Events/Event/Event.stories.js +0 -22
- package/dist/stories/Pages/Events/Events/Events.stories.js +0 -22
- package/dist/stories/Pages/Library/Folders/Library.stories.js +0 -22
- package/dist/stories/Pages/Library/Notes/Notes.stories.js +0 -22
- package/dist/stories/Pages/Music/MusicAlbum/Music.stories.js +0 -22
- package/dist/stories/Pages/Music/MusicAlbums/MusicAlbums.stories.js +0 -22
- package/dist/stories/Pages/Photos/Album/Album.stories.js +0 -22
- package/dist/stories/Pages/Photos/Albums/Albums.stories.js +0 -22
- package/dist/stories/Pages/Video/DetailedVideo/DetailedVideo.stories.js +0 -22
- package/dist/stories/Pages/Video/VideoAlbum/Video.stories.js +0 -22
- package/dist/stories/Pages/ViewWorld/ViewWorld.stories.js +0 -264
- package/dist/stories/Photo Album/DetailedPhoto/DetailedPhoto.stories.js +0 -32
- package/dist/stories/Photo Album/ViewAlbum/ViewAlbum.stories.js +0 -115
- package/dist/stories/Photo Album/ViewAlbums/ViewAlbums.stories.js +0 -102
- package/dist/stories/Reusable Components/Cards/Card-style-1/CardStyle1.stories.js +0 -35
- package/dist/stories/Reusable Components/Cards/Card-style-10/CardStyle10.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-11/CardStyle11.stories.js +0 -40
- package/dist/stories/Reusable Components/Cards/Card-style-2/CardStyle2.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-3/CardStyle3.stories.js +0 -34
- package/dist/stories/Reusable Components/Cards/Card-style-4/CardStyle4.stories.js +0 -39
- package/dist/stories/Reusable Components/Cards/Card-style-6/CardStyle6.stories.js +0 -27
- package/dist/stories/Reusable Components/Cards/Card-style-7/CardStyle7.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-8/CardStyle8.stories.js +0 -44
- package/dist/stories/Reusable Components/Cards/Card-style-9/CardStyle9.stories.js +0 -27
- package/dist/stories/Reusable Components/Cards/Card.stories.js +0 -132
- package/dist/stories/Reusable Components/Controls/Controls.stories.js +0 -49
- package/dist/stories/Reusable Components/Gallery/Gallery.stories.js +0 -56
- package/dist/stories/Reusable Components/Lists/Cards/ListCard-1.stories.js +0 -1
- package/dist/stories/Reusable Components/Lists/List.stories.js +0 -1
- package/dist/stories/Reusable Components/Mention/Mention.stories.js +0 -66
- package/dist/stories/Reusable Components/ReusableForm/ReusableForm.stories.js +0 -207
- package/dist/stories/Reusable Components/ReusableHeader/ReusableHeader.stories.js +0 -35
- package/dist/stories/Reusable Components/ReusableList/ReusableList.stories.js +0 -84
- package/dist/stories/Reusable Components/SearchCard/SearchCard.stories.js +0 -24
- package/dist/stories/Reusable Components/SpaceContainer/SpaceContainer.stories.js +0 -80
- package/dist/stories/Reusable Components/Spinner/Spinner.stories.js +0 -22
- package/dist/stories/Reusable Components/WidgetContainer/WidgetContainer.stories.js +0 -80
- package/dist/stories/Spaces/WelcomeSpace/WelcomeSpace.stories.js +0 -24
- package/dist/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.stories.js +0 -101
- package/dist/stories/VideoAlbum/Comments/Comments.stories.js +0 -45
- package/dist/stories/VideoAlbum/VideoPlayer/VideoPlayer.stories.js +0 -149
- package/dist/stories/VideoAlbum/VideoSpace/VideoSpace.stories.js +0 -49
- package/dist/stories/VideoAlbum/ViewAlbum/ViewAlbum.stories.js +0 -113
- package/dist/stories/Widgets/LogoWidget/LogoWidget.stories.js +0 -26
- package/dist/stories/Widgets/MusicPlayer/MusicPlayer.stories.js +0 -44
- package/dist/stories/Widgets/MusicPlayerWidget/MusicPlayerWidget.stories.js +0 -52
- package/dist/stories/Widgets/SpacesList/SpacesList.stories.js +0 -52
- package/dist/stories/Widgets/SpacesList/SpacesListItem.stories.js +0 -24
- package/public/logo192.png +0 -0
- package/public/logo512.png +0 -0
- package/src/stories/API/API.stories.js +0 -10
- package/src/stories/Agora/Chat/Chat.stories.jsx +0 -10
- package/src/stories/Agora/Room/Room.stories.jsx +0 -10
- package/src/stories/Buttons/Buttons/Buttons.stories.jsx +0 -24
- package/src/stories/Buttons/ReactModal/ReactModal.stories.jsx +0 -18
- package/src/stories/Chat/Chat.stories.jsx +0 -59
- package/src/stories/Common Inputs/CheckboxGroup/CheckboxGroup.stories.jsx +0 -32
- package/src/stories/Common Inputs/CustomAutoComplete/CustomAutoComplete.stories.jsx +0 -35
- package/src/stories/Common Inputs/CustomDropzone/CustomDropzone.stories.jsx +0 -26
- package/src/stories/Common Inputs/CustomSelect/CustomSelect.stories.jsx +0 -36
- package/src/stories/Common Inputs/CustomTextarea/CustomTextarea.stories.jsx +0 -31
- package/src/stories/Common Inputs/DatePicker/DatePicker.stories.jsx +0 -47
- package/src/stories/Common Inputs/EditorComponent/EditorComponent.stories.jsx +0 -60
- package/src/stories/Common Inputs/Formik/InputField/InputField.stories.jsx +0 -27
- package/src/stories/Common Inputs/Formik/RadioField/RadioField.stories.jsx +0 -41
- package/src/stories/Common Inputs/RadioInput/RadioInput.stories.js +0 -30
- package/src/stories/Common Inputs/RichTextInput/RichTextInput.stories.js +0 -45
- package/src/stories/Common Inputs/TextField/TextField.stories.jsx +0 -31
- package/src/stories/Containers/BaseMaterial.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetBody.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetExample.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetHead.stories.js +0 -10
- package/src/stories/Enrollment/Admin/CreateForm/CreateForm.stories.jsx +0 -8
- package/src/stories/Enrollment/Admin/DetailedForm/DetailedForm.stories.jsx +0 -36
- package/src/stories/Enrollment/Admin/ViewForms/ViewForms.stories.jsx +0 -66
- package/src/stories/Enrollment/Guest/FillForm/FillForm.stories.jsx +0 -27
- package/src/stories/Events/CreateEvent/CreateEvent.stories.jsx +0 -19
- package/src/stories/Events/Event/Event.stories.jsx +0 -21
- package/src/stories/Events/EventsList/EventsList.stories.jsx +0 -25
- package/src/stories/Forms/AddPhoto/AddPhoto.stories.jsx +0 -37
- package/src/stories/Forms/AddSong/AddSong.stories.jsx +0 -26
- package/src/stories/Forms/AddVideo/AddVideo.stories.jsx +0 -20
- package/src/stories/Forms/Create-Profile/CreateProfile.stories.jsx +0 -36
- package/src/stories/Forms/Create-Profile/subcomponents/LogoUploader.stories.jsx +0 -27
- package/src/stories/Forms/Create-Profile/subcomponents/ProfilePhoto.stories.jsx +0 -26
- package/src/stories/Forms/Create-Profile/subcomponents/ResetBtn.stories.jsx +0 -18
- package/src/stories/Forms/CreateAlbum/CreateAlbum.stories.jsx +0 -37
- package/src/stories/Forms/CreateAnnouncementForm/CreateAnnouncementForm.stories.jsx +0 -44
- package/src/stories/Forms/CreateMusicAlbum/CreateMusicAlbum.stories.jsx +0 -38
- package/src/stories/Forms/CreateProfile/CreateProfile.stories.js +0 -10
- package/src/stories/Forms/CreateProfile-3/CreateProfile.stories.js +0 -10
- package/src/stories/Forms/CreateUser/CreateUser.stories.js +0 -10
- package/src/stories/Forms/CreateVideoAlbum/CreateVideoAlbum.stories.jsx +0 -23
- package/src/stories/Forms/Form/Form.stories.js +0 -10
- package/src/stories/Forms/NewProfile/NewProfile.stories.jsx +0 -10
- package/src/stories/Layout/Body/Body.stories.js +0 -26
- package/src/stories/Layout/Center/Center.stories.js +0 -14
- package/src/stories/Layout/Head/Head.stories.js +0 -10
- package/src/stories/Layout/Left/Left.stories.js +0 -14
- package/src/stories/Layout/Right/Right.stories.js +0 -14
- package/src/stories/Library/CreateFolder/CreateFolder.stories.jsx +0 -32
- package/src/stories/Library/Folders/Folders.stories.jsx +0 -34
- package/src/stories/Library/Notes/Notes.stories.jsx +0 -24
- package/src/stories/Library/ViewNote/ViewNote.stories.jsx +0 -16
- package/src/stories/Music Album/ViewAlbum/ViewAlbum.stories.jsx +0 -60
- package/src/stories/Music Album/ViewAlbums/ViewAlbums.stories.jsx +0 -57
- package/src/stories/Navbar/Navbar.stories.js +0 -25
- package/src/stories/Pages/Blank/Blank.stories.js +0 -10
- package/src/stories/Pages/Centered/Centered.stories.js +0 -14
- package/src/stories/Pages/Chat/Chat.stories.jsx +0 -53
- package/src/stories/Pages/Enrollment/DetailedForm/DetailedForm.stories.jsx +0 -8
- package/src/stories/Pages/Enrollment/FillForm/FillForm.stories.jsx +0 -8
- package/src/stories/Pages/Enrollment/Forms/Forms.stories.jsx +0 -8
- package/src/stories/Pages/Events/Event/Event.stories.jsx +0 -8
- package/src/stories/Pages/Events/Events/Events.stories.jsx +0 -8
- package/src/stories/Pages/Library/Folders/Library.stories.jsx +0 -8
- package/src/stories/Pages/Library/Notes/Notes.stories.jsx +0 -8
- package/src/stories/Pages/Music/MusicAlbum/Music.stories.jsx +0 -8
- package/src/stories/Pages/Music/MusicAlbums/MusicAlbums.stories.jsx +0 -8
- package/src/stories/Pages/Photos/Album/Album.stories.jsx +0 -8
- package/src/stories/Pages/Photos/Albums/Albums.stories.jsx +0 -8
- package/src/stories/Pages/Video/DetailedVideo/DetailedVideo.stories.jsx +0 -8
- package/src/stories/Pages/Video/VideoAlbum/Video.stories.jsx +0 -8
- package/src/stories/Pages/ViewWorld/ViewWorld.stories.js +0 -270
- package/src/stories/Photo Album/DetailedPhoto/DetailedPhoto.stories.jsx +0 -20
- package/src/stories/Photo Album/ViewAlbum/ViewAlbum.stories.jsx +0 -60
- package/src/stories/Photo Album/ViewAlbums/ViewAlbums.stories.jsx +0 -59
- package/src/stories/Reusable Components/Cards/Card-style-1/CardStyle1.stories.jsx +0 -22
- package/src/stories/Reusable Components/Cards/Card-style-10/CardStyle10.stories.jsx +0 -21
- package/src/stories/Reusable Components/Cards/Card-style-11/CardStyle11.stories.jsx +0 -21
- package/src/stories/Reusable Components/Cards/Card-style-2/CardStyle2.stories.jsx +0 -24
- package/src/stories/Reusable Components/Cards/Card-style-3/CardStyle3.stories.jsx +0 -22
- package/src/stories/Reusable Components/Cards/Card-style-4/CardStyle4.stories.jsx +0 -25
- package/src/stories/Reusable Components/Cards/Card-style-6/CardStyle6.stories.jsx +0 -9
- package/src/stories/Reusable Components/Cards/Card-style-7/CardStyle7.stories.jsx +0 -23
- package/src/stories/Reusable Components/Cards/Card-style-8/CardStyle8.stories.jsx +0 -29
- package/src/stories/Reusable Components/Cards/Card-style-9/CardStyle9.stories.jsx +0 -14
- package/src/stories/Reusable Components/Cards/Card.stories.jsx +0 -118
- package/src/stories/Reusable Components/Controls/Controls.stories.jsx +0 -24
- package/src/stories/Reusable Components/Gallery/Gallery.stories.jsx +0 -43
- package/src/stories/Reusable Components/Lists/Cards/ListCard-1.stories.js +0 -0
- package/src/stories/Reusable Components/Lists/List.stories.js +0 -0
- package/src/stories/Reusable Components/Mention/Mention.stories.jsx +0 -55
- package/src/stories/Reusable Components/ReusableForm/ReusableForm.stories.jsx +0 -167
- package/src/stories/Reusable Components/ReusableHeader/ReusableHeader.stories.jsx +0 -22
- package/src/stories/Reusable Components/ReusableList/ReusableList.stories.jsx +0 -70
- package/src/stories/Reusable Components/SearchCard/SearchCard.stories.js +0 -10
- package/src/stories/Reusable Components/SpaceContainer/SpaceContainer.stories.jsx +0 -78
- package/src/stories/Reusable Components/Spinner/Spinner.stories.jsx +0 -8
- package/src/stories/Reusable Components/WidgetContainer/WidgetContainer.stories.jsx +0 -61
- package/src/stories/Spaces/WelcomeSpace/WelcomeSpace.stories.js +0 -10
- package/src/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.stories.jsx +0 -59
- package/src/stories/VideoAlbum/Comments/Comments.stories.jsx +0 -18
- package/src/stories/VideoAlbum/VideoPlayer/VideoPlayer.stories.jsx +0 -82
- package/src/stories/VideoAlbum/VideoSpace/VideoSpace.stories.jsx +0 -23
- package/src/stories/VideoAlbum/ViewAlbum/ViewAlbum.stories.jsx +0 -57
- package/src/stories/Widgets/LogoWidget/LogoWidget.stories.js +0 -12
- package/src/stories/Widgets/MusicPlayer/MusicPlayer.stories.jsx +0 -23
- package/src/stories/Widgets/MusicPlayerWidget/MusicPlayerWidget.stories.jsx +0 -33
- package/src/stories/Widgets/SpacesList/SpacesList.stories.jsx +0 -27
- package/src/stories/Widgets/SpacesList/SpacesListItem.stories.jsx +0 -10
- package/src/stories/assets/images/album1.jpg +0 -0
- package/src/stories/assets/images/album2.jpg +0 -0
- package/src/stories/assets/images/album3.jpg +0 -0
- package/src/stories/assets/images/album4.jpg +0 -0
- package/src/stories/assets/images/album5.jpg +0 -0
- package/src/stories/assets/images/album6.jpg +0 -0
- package/src/stories/assets/images/art.jpg +0 -0
- package/src/stories/assets/images/dance.jpg +0 -0
- package/src/stories/assets/images/football.jpg +0 -0
- package/src/stories/assets/images/music.jpg +0 -0
- package/src/stories/assets/images/music1.jpg +0 -0
- package/src/stories/assets/images/music2.jpg +0 -0
- package/src/stories/assets/images/music3.jpg +0 -0
- package/src/stories/assets/images/music4.jpg +0 -0
- package/src/stories/assets/images/music5.jpg +0 -0
- package/src/stories/assets/images/music6.jpg +0 -0
- package/src/stories/assets/images/reset.png +0 -0
- package/src/stories/assets/images/robotics.jpg +0 -0
- package/src/stories/assets/images/tennis.jpg +0 -0
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import ViewNote from './ViewNote';
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
title: 'Library/View Note',
|
|
5
|
-
component: ViewNote
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const Template = (args) => (
|
|
9
|
-
<ViewNote
|
|
10
|
-
{...args} />
|
|
11
|
-
);
|
|
12
|
-
|
|
13
|
-
export const Note = Template.bind({});
|
|
14
|
-
Note.args = {
|
|
15
|
-
|
|
16
|
-
};
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
import React, { useState } from 'react'
|
|
2
|
-
import ViewAlbum from "./ViewAlbum";
|
|
3
|
-
|
|
4
|
-
import { addObjectToArray, deleteFromArrayByIndex } from '../../helpers/util';
|
|
5
|
-
import img1 from '../../assets/images/music1.jpg';
|
|
6
|
-
import img2 from '../../assets/images/music2.jpg';
|
|
7
|
-
import img3 from '../../assets/images/music3.jpg';
|
|
8
|
-
import img4 from '../../assets/images/music4.jpg';
|
|
9
|
-
import img5 from '../../assets/images/music5.jpg';
|
|
10
|
-
import img6 from '../../assets/images/music6.jpg';
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
export default {
|
|
14
|
-
title: 'Music Albums/Album List',
|
|
15
|
-
component: ViewAlbum
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export const Album = args => {
|
|
19
|
-
const [album, setAlbum] = useState([
|
|
20
|
-
{ index: 0, cover: img4, title: 'Plans We Made', description: 'Son Lux', time: '5:20' },
|
|
21
|
-
{ index: 2, cover: img6, title: 'Still Loving You', description: 'Scorpions', time: '4:20' },
|
|
22
|
-
{ index: 1, cover: img5, title: 'Night', description: 'Frank Ocean', time: '5:20' },
|
|
23
|
-
{ index: 3, cover: img1, title: 'Somebody Else', description: '1975', time: '5:20' },
|
|
24
|
-
{ index: 4, cover: img3, title: 'Enter Sandman', description: 'Metallica', time: '5:20' },
|
|
25
|
-
{ index: 5, cover: img2, title: 'November Rain', description: "Guns N' Roses", time: '5:20' },
|
|
26
|
-
])
|
|
27
|
-
|
|
28
|
-
const cardIconClicked = (action, index) => {
|
|
29
|
-
switch (action) {
|
|
30
|
-
case 'delete':
|
|
31
|
-
onDeleteSong(index)
|
|
32
|
-
break;
|
|
33
|
-
default:
|
|
34
|
-
break;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
const onAddSong = (song) => {
|
|
39
|
-
const newSong = {
|
|
40
|
-
song: song.file,
|
|
41
|
-
img: song.cover.meta.previewUrl,
|
|
42
|
-
title: song.title,
|
|
43
|
-
description: song.artist,
|
|
44
|
-
time: new Date(song.song.meta.duration * 1000).toISOString().substr(14, 5)
|
|
45
|
-
}
|
|
46
|
-
setAlbum(addObjectToArray(album, newSong))
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
const onDeleteSong = (index) => {
|
|
50
|
-
setAlbum(deleteFromArrayByIndex(album, index))
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
return (
|
|
54
|
-
<ViewAlbum
|
|
55
|
-
album={album}
|
|
56
|
-
onAddSong={onAddSong}
|
|
57
|
-
cardIconClicked={cardIconClicked}
|
|
58
|
-
{...args} />
|
|
59
|
-
)
|
|
60
|
-
}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import React, { useState } from 'react';
|
|
2
|
-
import ViewAlbums from "./ViewAlbums";
|
|
3
|
-
import { deleteFromArrayByIndex, addObjectToArray } from '../../helpers/util';
|
|
4
|
-
|
|
5
|
-
import img1 from '../../assets/images/music1.jpg';
|
|
6
|
-
import img2 from '../../assets/images/music2.jpg';
|
|
7
|
-
import img3 from '../../assets/images/music3.jpg';
|
|
8
|
-
import img4 from '../../assets/images/music4.jpg';
|
|
9
|
-
import img5 from '../../assets/images/music5.jpg';
|
|
10
|
-
import img6 from '../../assets/images/music6.jpg';
|
|
11
|
-
|
|
12
|
-
export default {
|
|
13
|
-
title: 'Music Albums/Music Albums',
|
|
14
|
-
component: ViewAlbums
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
export const Albums = args => {
|
|
18
|
-
const [albums, setAlbums] = useState([
|
|
19
|
-
{ index: 0, img: img4, title: 'Tomorrows |', description: 'Son Lux' },
|
|
20
|
-
{ index: 1, img: img5, title: 'Blond', description: 'Frank Ocean' },
|
|
21
|
-
{ index: 2, img: img6, title: 'Love At First Sting', description: 'Scorpions' },
|
|
22
|
-
{ index: 3, img: img1, title: 'The 1975', description: '1975' },
|
|
23
|
-
{ index: 4, img: img3, title: 'Hardwired...To Self-Destruct', description: 'Metallica' },
|
|
24
|
-
{ index: 5, img: img2, title: 'Use Your IIIlusion |', description: "Guns N' Roses" },
|
|
25
|
-
])
|
|
26
|
-
|
|
27
|
-
const cardIconClicked = (action, index) => {
|
|
28
|
-
switch (action) {
|
|
29
|
-
case 'delete':
|
|
30
|
-
deleteFromAlbums(index)
|
|
31
|
-
break;
|
|
32
|
-
default:
|
|
33
|
-
break;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
const onAddAlbum = (album) => {
|
|
38
|
-
const newAlbum = {
|
|
39
|
-
img: album.cover.preview,
|
|
40
|
-
title: album.title,
|
|
41
|
-
description: album.artist
|
|
42
|
-
}
|
|
43
|
-
setAlbums(addObjectToArray(albums, newAlbum))
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
const deleteFromAlbums = (index) => {
|
|
47
|
-
setAlbums(deleteFromArrayByIndex(albums, index))
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
return (
|
|
51
|
-
<ViewAlbums
|
|
52
|
-
albums={albums}
|
|
53
|
-
cardIconClicked={cardIconClicked}
|
|
54
|
-
onAddAlbum={onAddAlbum}
|
|
55
|
-
{...args} />
|
|
56
|
-
)
|
|
57
|
-
}
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
|
|
3
|
-
import Navbar from './Navbar';
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Navbar/Default',
|
|
7
|
-
component: Navbar,
|
|
8
|
-
argTypes: {
|
|
9
|
-
iconSize: {
|
|
10
|
-
options: ['sm', 'md', 'lg'],
|
|
11
|
-
control: { type: 'select' },
|
|
12
|
-
},
|
|
13
|
-
iconBackgroundColor: {
|
|
14
|
-
type: 'string',
|
|
15
|
-
},
|
|
16
|
-
navbarColor: {
|
|
17
|
-
type: 'string',
|
|
18
|
-
},
|
|
19
|
-
dropDownItemHeight: {
|
|
20
|
-
type: 'string',
|
|
21
|
-
},
|
|
22
|
-
},
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export const Default = (props) => <Navbar {...props} />;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
|
|
3
|
-
import Centered from './Centered';
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Pages/Centered',
|
|
7
|
-
component: Centered,
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
export const Default = (props) => (
|
|
11
|
-
<Centered {...props}>
|
|
12
|
-
Welcome To Community Builder Pro
|
|
13
|
-
</Centered>
|
|
14
|
-
)
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import Chat from "./Chat";
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
title: 'Pages/Chat',
|
|
5
|
-
component: Chat
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const users = [
|
|
9
|
-
{
|
|
10
|
-
id: 'walter',
|
|
11
|
-
display: 'Walter White',
|
|
12
|
-
},
|
|
13
|
-
{
|
|
14
|
-
id: 'jesse',
|
|
15
|
-
display: 'Jesse Pinkman',
|
|
16
|
-
},
|
|
17
|
-
{
|
|
18
|
-
id: 'gus',
|
|
19
|
-
display: 'Gustavo "Gus" Fring',
|
|
20
|
-
},
|
|
21
|
-
{
|
|
22
|
-
id: 'saul',
|
|
23
|
-
display: 'Saul Goodman',
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
id: 'hank',
|
|
27
|
-
display: 'Hank Schrader',
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
id: 'skyler',
|
|
31
|
-
display: 'Skyler White',
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
id: 'mike',
|
|
35
|
-
display: 'Mike Ehrmantraut',
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
id: 'lydia',
|
|
39
|
-
display: 'Lydìã Rôdarté-Qüayle',
|
|
40
|
-
},
|
|
41
|
-
]
|
|
42
|
-
|
|
43
|
-
const data = [
|
|
44
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
|
45
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test ', media:(<img src="https://arabhardware.net/wp-content/uploads/2020/03/valorant-2020-4k-0f-scaled.jpg"/>)},
|
|
46
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
|
47
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
|
48
|
-
]
|
|
49
|
-
|
|
50
|
-
export const Page = args => <Chat
|
|
51
|
-
users={users}
|
|
52
|
-
data={data}
|
|
53
|
-
{...args} />
|
|
@@ -1,270 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import withMock from 'storybook-addon-mock';
|
|
3
|
-
|
|
4
|
-
import ViewWorld from './ViewWorld';
|
|
5
|
-
// Temporary constatns
|
|
6
|
-
import {
|
|
7
|
-
CARGO_DATA,
|
|
8
|
-
CARGO_SONGS,
|
|
9
|
-
MUSIC_DATA,
|
|
10
|
-
MUSIC_SONGS,
|
|
11
|
-
GAMING_DATA,
|
|
12
|
-
GAMING_SONGS,
|
|
13
|
-
MOVIES_DATA,
|
|
14
|
-
MOVIES_SONGS
|
|
15
|
-
} from "./constatnts";
|
|
16
|
-
|
|
17
|
-
export default {
|
|
18
|
-
title: 'Pages/world/world_id',
|
|
19
|
-
component: ViewWorld,
|
|
20
|
-
decorators: [withMock]
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
const Template = (args) => <ViewWorld {...args} />;
|
|
24
|
-
// Cargo Sprint data
|
|
25
|
-
export const Public = Template.bind({});
|
|
26
|
-
Public.parameters = {
|
|
27
|
-
mockData: [
|
|
28
|
-
{
|
|
29
|
-
url: 'https://jsonplaceholder.typicode.com/editor',
|
|
30
|
-
method: 'GET',
|
|
31
|
-
status: 200,
|
|
32
|
-
response: {
|
|
33
|
-
editorData: CARGO_DATA,
|
|
34
|
-
styles: {
|
|
35
|
-
backgroundColor: '#fff',
|
|
36
|
-
},
|
|
37
|
-
listStyles: {
|
|
38
|
-
headerTitleColor: '#F6891F',
|
|
39
|
-
},
|
|
40
|
-
sectionsStyles: {
|
|
41
|
-
sectionHeader: {
|
|
42
|
-
cardBorderSize: 2,
|
|
43
|
-
cardPadding: 2,
|
|
44
|
-
cardBackgroundColor: '#fff',
|
|
45
|
-
cardBorderColor: '#F6891F',
|
|
46
|
-
},
|
|
47
|
-
card: {
|
|
48
|
-
cardPadding: 6,
|
|
49
|
-
cardTitleFontSize: 15,
|
|
50
|
-
cardBackgroundColor: 'black',
|
|
51
|
-
cardTitleColor: 'white',
|
|
52
|
-
onHoverBackgroundColor: '#F6891F',
|
|
53
|
-
controlsStyles: {
|
|
54
|
-
showOnHover: true,
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
},
|
|
60
|
-
{
|
|
61
|
-
url: 'https://jsonplaceholder.typicode.com/music',
|
|
62
|
-
method: 'GET',
|
|
63
|
-
status: 200,
|
|
64
|
-
response: {
|
|
65
|
-
songs: CARGO_SONGS,
|
|
66
|
-
styles: {
|
|
67
|
-
backgroundColor: '#fff',
|
|
68
|
-
primaryColor: 'black'
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
],
|
|
73
|
-
};
|
|
74
|
-
Public.args= {
|
|
75
|
-
imgUrl: 'https://cargosprint.com/assets/img/cs-logos/Logo-CargoSprint_horizontal-color.png'
|
|
76
|
-
}
|
|
77
|
-
// Music Data
|
|
78
|
-
export const Music = Template.bind({});
|
|
79
|
-
Music.parameters = {
|
|
80
|
-
mockData: [
|
|
81
|
-
{
|
|
82
|
-
url: 'https://jsonplaceholder.typicode.com/editor',
|
|
83
|
-
method: 'GET',
|
|
84
|
-
status: 200,
|
|
85
|
-
response: {
|
|
86
|
-
editorData: MUSIC_DATA,
|
|
87
|
-
styles: {
|
|
88
|
-
backgroundColor: 'black',
|
|
89
|
-
fontColor: '#fff'
|
|
90
|
-
},
|
|
91
|
-
listStyles: {
|
|
92
|
-
headerTitleColor: '#E445AC',
|
|
93
|
-
|
|
94
|
-
},
|
|
95
|
-
sectionsStyles: {
|
|
96
|
-
sectionHeader: {
|
|
97
|
-
cardBorderSize: 2,
|
|
98
|
-
cardPadding: 2,
|
|
99
|
-
cardBackgroundColor: 'black',
|
|
100
|
-
cardBorderColor: '#E445AC',
|
|
101
|
-
cardTitleColor: 'white'
|
|
102
|
-
},
|
|
103
|
-
card: {
|
|
104
|
-
cardPadding: 6,
|
|
105
|
-
cardTitleFontSize: 15,
|
|
106
|
-
cardBackgroundColor: '#fff',
|
|
107
|
-
onHoverBackgroundColor: '#E445AC',
|
|
108
|
-
cardTitleColor: 'black',
|
|
109
|
-
controlsStyles: {
|
|
110
|
-
showOnHover: true,
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
},
|
|
117
|
-
{
|
|
118
|
-
url: 'https://jsonplaceholder.typicode.com/music',
|
|
119
|
-
method: 'GET',
|
|
120
|
-
status: 200,
|
|
121
|
-
response: {
|
|
122
|
-
songs: MUSIC_SONGS,
|
|
123
|
-
styles: {
|
|
124
|
-
backgroundColor: '#e445ac',
|
|
125
|
-
primaryColor: '#a9afac',
|
|
126
|
-
borderSize: 3,
|
|
127
|
-
borderColor: 'white',
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
},
|
|
131
|
-
],
|
|
132
|
-
};
|
|
133
|
-
Music.args = {
|
|
134
|
-
backgroundColor: 'black',
|
|
135
|
-
color: '#FCB4BE',
|
|
136
|
-
imgUrl: 'https://i.imgur.com/6vISA8U.png',
|
|
137
|
-
hoverColor: 'black'
|
|
138
|
-
}
|
|
139
|
-
// Gaming Data
|
|
140
|
-
export const Gaming = Template.bind({});
|
|
141
|
-
Gaming.parameters = {
|
|
142
|
-
mockData: [
|
|
143
|
-
{
|
|
144
|
-
url: 'https://jsonplaceholder.typicode.com/editor',
|
|
145
|
-
method: 'GET',
|
|
146
|
-
status: 200,
|
|
147
|
-
response: {
|
|
148
|
-
editorData: GAMING_DATA,
|
|
149
|
-
styles: {
|
|
150
|
-
backgroundColor: 'black',
|
|
151
|
-
fontColor: '#fff'
|
|
152
|
-
},
|
|
153
|
-
listStyles: {
|
|
154
|
-
headerTitleColor: '#FE4554',
|
|
155
|
-
|
|
156
|
-
},
|
|
157
|
-
sectionsStyles: {
|
|
158
|
-
sectionHeader: {
|
|
159
|
-
cardBorderSize: 2,
|
|
160
|
-
cardPadding: 2,
|
|
161
|
-
cardBackgroundColor: '#fff',
|
|
162
|
-
cardBorderColor: '#FE4554',
|
|
163
|
-
cardTitleColor: 'black'
|
|
164
|
-
},
|
|
165
|
-
card: {
|
|
166
|
-
cardPadding: 6,
|
|
167
|
-
cardTitleFontSize: 15,
|
|
168
|
-
cardBackgroundColor: '#131F2A',
|
|
169
|
-
cardTitleColor: 'white',
|
|
170
|
-
onHoverBackgroundColor: '#FE4554',
|
|
171
|
-
cardTitleColor: 'white',
|
|
172
|
-
controlsStyles: {
|
|
173
|
-
showOnHover: true,
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
},
|
|
179
|
-
{
|
|
180
|
-
url: 'https://jsonplaceholder.typicode.com/music',
|
|
181
|
-
method: 'GET',
|
|
182
|
-
status: 200,
|
|
183
|
-
response: {
|
|
184
|
-
songs: GAMING_SONGS,
|
|
185
|
-
styles: {
|
|
186
|
-
backgroundColor: '#131F2A',
|
|
187
|
-
primaryColor: '#FE4554',
|
|
188
|
-
borderSize: 2,
|
|
189
|
-
borderColor: '#FE4554',
|
|
190
|
-
borderRadius: 15
|
|
191
|
-
}
|
|
192
|
-
}
|
|
193
|
-
},
|
|
194
|
-
],
|
|
195
|
-
};
|
|
196
|
-
Gaming.args = {
|
|
197
|
-
backgroundColor: '#131F2A',
|
|
198
|
-
color: 'white',
|
|
199
|
-
imgUrl: 'https://i.imgur.com/sye5txB.png',
|
|
200
|
-
hoverColor: 'black',
|
|
201
|
-
editor: {
|
|
202
|
-
backgroundImage: 'https://img.wallpapersafari.com/tablet/1536/2048/36/65/dgOZ6K.jpg'
|
|
203
|
-
}
|
|
204
|
-
}
|
|
205
|
-
// Movies Data
|
|
206
|
-
export const Movies = Template.bind({});
|
|
207
|
-
Movies.parameters = {
|
|
208
|
-
mockData: [
|
|
209
|
-
{
|
|
210
|
-
url: 'https://jsonplaceholder.typicode.com/editor',
|
|
211
|
-
method: 'GET',
|
|
212
|
-
status: 200,
|
|
213
|
-
response: {
|
|
214
|
-
editorData: MOVIES_DATA,
|
|
215
|
-
styles: {
|
|
216
|
-
backgroundColor: 'black',
|
|
217
|
-
fontColor: '#fff'
|
|
218
|
-
},
|
|
219
|
-
listStyles: {
|
|
220
|
-
headerTitleColor: '#FE4554',
|
|
221
|
-
|
|
222
|
-
},
|
|
223
|
-
sectionsStyles: {
|
|
224
|
-
sectionHeader: {
|
|
225
|
-
cardBorderSize: 2,
|
|
226
|
-
cardPadding: 2,
|
|
227
|
-
cardBackgroundColor: 'transparent',
|
|
228
|
-
cardBorderColor: '#FE4554',
|
|
229
|
-
cardTitleColor: 'white'
|
|
230
|
-
},
|
|
231
|
-
card: {
|
|
232
|
-
cardPadding: 6,
|
|
233
|
-
cardTitleFontSize: 15,
|
|
234
|
-
cardBackgroundColor: 'black',
|
|
235
|
-
onHoverBackgroundColor: '#FE4554',
|
|
236
|
-
cardTitleColor: 'gray',
|
|
237
|
-
controlsStyles: {
|
|
238
|
-
showOnHover: true,
|
|
239
|
-
|
|
240
|
-
}
|
|
241
|
-
}
|
|
242
|
-
}
|
|
243
|
-
}
|
|
244
|
-
},
|
|
245
|
-
{
|
|
246
|
-
url: 'https://jsonplaceholder.typicode.com/music',
|
|
247
|
-
method: 'GET',
|
|
248
|
-
status: 200,
|
|
249
|
-
response: {
|
|
250
|
-
songs: MOVIES_SONGS,
|
|
251
|
-
styles: {
|
|
252
|
-
backgroundColor: 'black',
|
|
253
|
-
primaryColor: 'gray',
|
|
254
|
-
borderSize: 2,
|
|
255
|
-
borderColor: 'gray',
|
|
256
|
-
borderRadius: 15
|
|
257
|
-
}
|
|
258
|
-
}
|
|
259
|
-
},
|
|
260
|
-
],
|
|
261
|
-
};
|
|
262
|
-
Movies.args = {
|
|
263
|
-
backgroundColor: 'black',
|
|
264
|
-
color: 'gray',
|
|
265
|
-
imgUrl: 'https://i.imgur.com/DfxFp56.png',
|
|
266
|
-
hoverColor: 'black',
|
|
267
|
-
editor: {
|
|
268
|
-
backgroundImage: 'https://thegreatfredini.files.wordpress.com/2015/10/img_0687.jpg'
|
|
269
|
-
}
|
|
270
|
-
}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import DetailedPhoto from "./DetailedPhoto";
|
|
2
|
-
|
|
3
|
-
import img5 from '../../assets/images/album5.jpg';
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Photo Album/Photo',
|
|
7
|
-
component: DetailedPhoto
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export const photo = args => <DetailedPhoto
|
|
11
|
-
img={{
|
|
12
|
-
index: 0,
|
|
13
|
-
img: img5,
|
|
14
|
-
title: 'Image 1',
|
|
15
|
-
description: 'This is description test',
|
|
16
|
-
date: '2021-11-30'
|
|
17
|
-
}}
|
|
18
|
-
|
|
19
|
-
{...args} />
|
|
20
|
-
|