\n 
\n\n \n\n \n\n \n
\n );\n}","import { IAction } from '../actions';\nimport { HideToast, ShowErrorToast, ShowInfoToast, ShowSuccessToast, ShowWarningToast, Submitting } from '../actionTypes';\n\nexport type ToastState = {\n show: boolean,\n severity: \"success\" | \"error\" | \"warning\" | \"info\" | undefined,\n message: string,\n submitting: boolean\n}\n\nconst toastState: ToastState = {\n show: false,\n severity: undefined,\n message: \"\",\n submitting: false\n}\n\nexport default function toastReducer(state = toastState, action: IAction): ToastState {\n\n switch (action.type) {\n case ShowSuccessToast: {\n return { ...state, severity: \"success\", show: true, message: action.payload, submitting: false };\n }\n case ShowErrorToast: {\n return { ...state, severity: \"error\", show: true, message: action.payload, submitting: false };\n }\n case ShowWarningToast: {\n return { ...state, severity: \"warning\", show: true, message: action.payload, submitting: false };\n }\n case ShowInfoToast: {\n return { ...state, severity: \"info\", show: true, message: action.payload, submitting: false };\n }\n case HideToast: {\n return { ...state, show: false, submitting: false };\n }\n case Submitting: {\n return { ...state, severity: \"info\", show: true, message: \"Submitting...\", submitting: true };\n }\n }\n\n return state;\n}\n\n","import { IAction } from '../actions';\n\nexport type ProfileState = {\n userId: null | string,\n name: null | string,\n title: null | string,\n picture: null | string\n}\n\nconst profileState: ProfileState = {\n userId: null,\n name: null,\n title: null,\n picture: null\n}\n\nexport default function profileReducer(state = profileState, action: IAction) {\n\n if (action.type === \"updateProfile\") {\n return { ...state, picture: action.payload.picture, title: action.payload.title, name: action.payload.name, userId: action.payload.userId };\n } \n\n return state;\n}\n\n","import { createSlice } from '@reduxjs/toolkit'\n\nexport interface Event {\n type: string,\n payload: any\n}\n\ninterface EventsState {\n postsEvent: Event | null\n}\n\nconst initialState: EventsState = {\n postsEvent: null\n}\n\nconst eventsSlice = createSlice({\n name: 'events',\n initialState,\n reducers: {\n newPostCreated(state, action) {\n state.postsEvent = {\n type: action.type,\n payload: { ...action.payload }\n };\n },\n postDeleted(state, action) {\n state.postsEvent = {\n type: action.type,\n payload: { ...action.payload }\n };\n },\n postUpdated(state, action) {\n state.postsEvent = {\n type: action.type,\n payload: { ...action.payload }\n };\n },\n clearEvents(state) {\n state.postsEvent = null;\n }\n }\n});\n\n\nconst { newPostCreated, postDeleted, postUpdated, clearEvents } = eventsSlice.actions;\n\nexport default eventsSlice.reducer;\nexport { newPostCreated, postDeleted, postUpdated, clearEvents };","import { createSlice } from '@reduxjs/toolkit'\nimport { NotificationItem } from '../../Types';\n\ninterface UsersNotificationsState {\n notifications: NotificationItem[]\n}\n\nconst initialState: UsersNotificationsState = {\n notifications: new Array\n
\n )\n}\n\nexport default NCancelIcon;","import React from 'react';\nimport '../../styles/n/nButton.scss';\n\ninterface Props extends React.DetailedHTMLProps\n \n\n
\n );\n }\n}\n\nconst mapStateToProps = (state: RootState) => {\n return {\n userId: state.profile.userId\n }\n}\n\nexport default connect(mapStateToProps, {\n hideToastAction,\n showErrorToastAction,\n showInfoToastAction,\n showSuccessToastAction,\n submittingAction,\n newPostCreated,\n postUpdated\n})(PostDialog)\n\n\nconst DialogContent = withStyles((theme) => ({\n root: {\n padding: theme.spacing(2),\n },\n}))(MuiDialogContent);\n\n","import { SearchRequest, SearchResult } from '../Types';\nimport { callApiWithResponseAsync } from './commonServices';\n\nexport const SearchCache: { [name: string]: SearchResult } = {};\n\nexport async function searchAsync(payload: SearchRequest): Promise\n
\n )\n }\n\n return (\n \n {props.message}\n
\n \n 
\n\n
\n )\n}\n\nexport default LiveSearchItem;\n\n\n","import React, { useEffect, useState } from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport InputBase from '@material-ui/core/InputBase';\nimport SearchIcon from '@material-ui/icons/Search';\nimport { useHistory } from 'react-router-dom';\nimport Popper from '@material-ui/core/Popper';\nimport Paper from '@material-ui/core/Paper';\nimport '../../styles/searchBar.scss';\nimport { searchAsync } from '../../services/searchService';\nimport LiveSearchItem from './LiveSearchItem';\nimport { SearchResult, UserInfo } from '../../Types';\n\nconst useStyles = makeStyles((theme) => ({\n inputInput: {\n padding: theme.spacing(1, 1, 1, 0),\n // vertical padding + font size from searchIcon\n paddingLeft: `calc(1em + ${theme.spacing(3)}px)`,\n transition: theme.transitions.create('width'),\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: '20ch',\n },\n }\n}));\n\nvar searchLoading = false;\n\nexport const getDefaultSearchResult = () => {\n return {\n limit: 0,\n length: 0,\n total: 0,\n users: new Array\n
\n {data!.name}
\n {data!.title || \"\"}
\n \n \n \n \n \n\n
\n );\n}\n\nexport default SearchBar;\n","import React, { useEffect, useState } from 'react';\nimport { Link } from 'react-router-dom';\nimport '../../styles/nav.scss';\nimport '../../styles/read.scss';\nimport { useAuth0 } from '@auth0/auth0-react';\nimport PopMenu from '../CustomDialogs/PopMenu';\nimport { AiOutlineNotification } from \"react-icons/ai\";\nimport { NIconButton } from '../NComponents/NButton';\nimport { getFriendlyTime } from '../../services/Helpers';\nimport { NotificationItem } from '../../Types';\nimport { useAppDispatch, useAppSelector } from '../../redux/store';\nimport { fetchUsersNotificationsAction } from '../../redux/actions';\n\n\nexport default function Notifications() {\n const { user } = useAuth0();\n const [notificationsAnchor, setNotificationsAnchor] = useState(null);\n\n const handleClick = (event: any) => {\n setNotificationsAnchor(event.currentTarget as any);\n };\n\n const handleClose = () => {\n setNotificationsAnchor(null);\n };\n\n const notifications = useAppSelector(state => state.usersNotifications.notifications);\n const reduxDispatch = useAppDispatch();\n\n useEffect(() => {\n reduxDispatch(fetchUsersNotificationsAction(user!.sub!));\n }, []);\n\n return (\n \n
\n\n \n {(data == null || data.length == 0) &&
\n \n {data.users.map((user) => {\n return (\n
\n }\n\n {data && data.total > MaxSearchBarItems && \n\n \n\n \n
\n );\n}\n\ninterface Props {\n data: NotificationItem,\n hideMenu: () => void\n}\n\nconst NotificationViewItem = (props: Props) => {\n\n const { picture, name, date, type, fromUserId } = props.data;\n\n let message = \"\";\n\n if (type == \"PostLike\") {\n message = ` liked your post`;\n } else if (type === \"CommentLike\") {\n message = ` liked your comment`;\n }\n\n return (\n \n Notifications\n
\n\n {notifications.length > 0 &&\n notifications.map((n, index) => {\n return (\n
\n\n \n\n {notifications.length > 0 &&\n notifications.map((n, index) => {\n return (\n
\n
}\n
\n )\n })\n }\n\n {notifications.length == 0 && }\n
Empty
}\n \n\n
\n )\n}","import React, { useState } from 'react';\nimport { Link } from 'react-router-dom';\nimport '../../styles/nav.scss';\nimport ProfileDropDown from './ProfileDropDown';\nimport { connect } from 'react-redux';\nimport PostDialog from '../CustomDialogs/PostDialog';\nimport SearchBar from '../Search/SearchBar';\nimport { NIconButton } from '../NComponents/NButton';\nimport { AiOutlineMessage } from \"react-icons/ai\";\nimport Notifications from './Notifications';\n\n\nfunction Nav() {\n const [postDialogOpen, setPostDialogOpen] = useState(false);\n\n const handleDialogClickOpen = () => {\n setPostDialogOpen(true);\n };\n\n const handleDialogClose = () => {\n setPostDialogOpen(false);\n };\n\n return (\n \n \n 
\n \n\n
\n\n {name}{message}
\n {getFriendlyTime(date)}
\n \n\n
\n );\n}\n\nexport default connect(null, null)(Nav)\n","import { ContinuationTokenHeader } from '../Constants';\nimport { Comment, CreateCommentRequest, UpdateCommentLikeRequest } from '../Types';\nimport { ApiResponse, callApiWithOkAsync, callApiWithPaginatedResponseAsync, callApiWithResponseAsync } from './commonServices';\n\nexport async function updateCommentLikeAsync(payload: UpdateCommentLikeRequest, keepalive = false): Promise\n
\n\n \n \n ![](\"/logo.png\")
\n Hikmasight\n \n (Preview)\n
\n\n \n Hikmasight\n \n (Preview)\n \n
\n \n\n
\n\n \n \n \n \n\n
\n )\n }\n}\n\nfunction mapStateToProps(state: RootState) {\n return {\n viewerUserId: state.profile.userId,\n loggedInUser: state.profile\n };\n}\n\nexport default connect(mapStateToProps, {})(CommentItem)\n","import React from 'react';\nimport { connect } from 'react-redux';\nimport Button from '@material-ui/core/Button';\nimport ThumbUpAltOutlinedIcon from '@material-ui/icons/ThumbUpAltOutlined';\nimport ThumbUpAltIcon from '@material-ui/icons/ThumbUpAlt';\nimport ChatBubbleOutlineOutlinedIcon from '@material-ui/icons/ChatBubbleOutlineOutlined';\nimport { updatePostLikeAsync } from '../../services/postsService';\nimport { handleGenericCounter } from '../../services/Helpers';\nimport { Post } from '../../Types';\nimport { GoComment } from 'react-icons/go';\n\ntype Props = {\n auth0Sub: string,\n data: Post,\n commentsCount: number\n}\n\ntype State = {\n likePost: boolean,\n likesCount: number,\n}\n\nclass PostButtons extends React.Component\n
\n\n \n\n
\n\n \n \n \n
\n\n \n \n
\n\n {createdByThisUser && {name}
\n \n\n {comment.replyToName && \n
}\n\n in reply to
\n\n \n {comment.replyToName}
\n \n {getFriendlyTime(comment.createdAt)}
\n {comment.content}
\n \n }\n
\n \n Like\n\n {this.state.likeCount >= 1 &&\n
\n\n {!createdByThisUser && \n
}\n •
\n \n {this.state.likeComment ?
\n {this.state.likeCount}
\n Reply
\n
\n
\n );\n }\n}\n\nexport default connect(null, {})(PostButtons);","import { ChangeEvent, useEffect, useReducer } from 'react';\nimport '../../styles/postFooter.scss';\nimport { createCommentAsync, getPostCommentsAsync } from '../../services/commentsService';\nimport { ReplyToComment, Comment } from '../../Types';\nimport { Completed, Loading, LoadingNextSet } from '../../redux/actionTypes';\nimport { IAction } from '../../redux/actions';\n\ntype ReplyTo = ReplyToComment & { name: string };\n\ntype State = {\n loading: boolean,\n userComment: string,\n replyingTo: ReplyTo | null,\n numberOfCommentsToShow: number,\n comments: Comment[],\n commentsCount: number,\n fetchedFromServer: boolean,\n continuationToken: string | null,\n loadingNextSet: boolean,\n page: number\n};\n\nconst MaxInitial = 3;\nconst BlockCount = 10;\nconst MaxPageCount = 5;\nconst MaxCommentCharLength = 2000;\n\nconst UpdateUserComment = \"UpdateUserComment\";\nconst NewComment = \"NewComment\";\nconst DeleteComment = \"DeleteComment\";\nconst SetReplyTo = \"SetReplyTo\";\nconst UpdateNumberOfCommentsToShow = \"UpdateNumberOfCommentsToShow\";\nconst ClearInputs = \"ClearInputs\";\n\nconst footerReducer = (state: State, action: IAction): State => {\n switch (action.type) {\n case Loading: {\n return { ...state, loading: true };\n }\n case Completed: {\n return {\n ...state,\n loading: false,\n fetchedFromServer: true,\n continuationToken: action.payload.continueToken,\n loadingNextSet: false,\n page: state.page + 1,\n comments: [...state.comments, ...action.payload.comments!],\n };\n }\n case NewComment: {\n const updated = { ...state };\n updated.comments.unshift(action.payload);\n return { ...updated, commentsCount: updated.commentsCount + 1, userComment: \"\", numberOfCommentsToShow: updated.numberOfCommentsToShow + 1 };\n }\n case DeleteComment: {\n return { ...state, comments: state.comments.filter(c => c.commentId != action.payload!), commentsCount: state.commentsCount - 1 };\n }\n case LoadingNextSet: {\n return { ...state, loadingNextSet: true };\n }\n case UpdateUserComment: {\n return { ...state, userComment: action.payload! };\n }\n case SetReplyTo: {\n return { ...state, replyingTo: action.payload };\n }\n case UpdateNumberOfCommentsToShow: {\n return { ...state, numberOfCommentsToShow: action.payload };\n }\n case ClearInputs: {\n return { ...state, replyingTo: null, userComment: \"\" };\n }\n default: {\n return state;\n }\n }\n}\n\nfunction useComments(postId: string, totalCommentsCount: number) {\n\n const [state, dispatch] = useReducer(footerReducer, {\n loading: true,\n userComment: \"\",\n replyingTo: null,\n numberOfCommentsToShow: MaxInitial,\n comments: new Array\n\n
\n \n {this.state.likePost ?\n }>{this.state.likesCount}\n :\n }>{this.state.likesCount}\n }\n
\n\n }>{this.props.commentsCount}\n \n
\n\n {showMore > 0 &&\n
\n \n )\n}\n\nexport default PostComments;","import React from \"react\";\nimport { withStyles } from '@material-ui/core/styles';\nimport Dialog from '@material-ui/core/Dialog';\nimport MuiDialogContent from '@material-ui/core/DialogContent';\nimport \"@pathofdev/react-tag-input/build/index.css\";\nimport NCancelIcon from \"../NComponents/NCancelIcon\";\nimport '../../styles/dialog.scss';\n\n\ntype ImageDialogProps = {\n handleClose: () => void,\n open: boolean,\n imageSrc: string\n}\n\ntype ImageDialogState = {\n}\n\nclass ImageDialog extends React.Component\n Show {showMore} previous comments\n
}\n\n {comments.length != 0 &&\n \n
\n
\n }\n\n \n {commentsToShow.map((c) =>
\n \n
\n {replyingTo &&\n
\n \n
}\n\n \n Replying to\n {replyingTo.name}\n
\n \n 
\n\n
\n \n
\n\n \n {userComment.trim().length > 0 &&
\n \n\n \n\n
\n );\n }\n}\n\nexport default ImageDialog;\n\nconst DialogContent = withStyles((theme) => ({\n root: {\n padding: theme.spacing(2),\n },\n}))(MuiDialogContent);\n\n","import React from 'react';\nimport { connect } from 'react-redux';\nimport Constants from '../../Constants';\nimport { Post } from '../../Types';\nimport ImageDialog from '../CustomDialogs/ImageDialog';\n\ntype Props = {\n data: Post\n}\n\ntype State = {\n cutBodyText: boolean,\n cutBodyLines: boolean,\n imageDialogOpen: boolean\n}\n\nclass PostBody extends React.Component\n {this.props.data.imageUrl &&\n
\n );\n }\n}\n\nexport default connect(null, {})(PostBody);","import React, { useState } from 'react';\nimport TextField from '@material-ui/core/TextField';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport { useAuth0 } from '@auth0/auth0-react';\nimport { reportPostAbuseAsync } from '../../services/postsService'\nimport { useDispatch } from 'react-redux';\nimport { showInfoToastAction } from '../../redux/actions';\nimport '../../styles/dialog.scss';\nimport NCancelIcon from '../NComponents/NCancelIcon';\nimport NButton from '../NComponents/NButton';\n\n\ntype Props = {\n open: boolean,\n postId: string,\n onClose: () => void\n}\n\nexport default function AbuseDialog(props: Props) {\n\n const { open, onClose, postId } = props;\n const [reason, setReason] = useState(\"\");\n const { user } = useAuth0();\n\n const dispatch = useDispatch()\n\n const onFieldChange = (e: React.ChangeEvent\n 
\n
}\n\n \n {bodytext}\n {(this.state.cutBodyText || this.state.cutBodyLines) && (... Read more)}\n
\n\n {this.props.data.tags && \n {this.props.data.tags.map((tag, index) => {\n return this.onTagClicked(tag)} className=\"post-tag\" key={index}>{tag}\n })}\n
}\n\n {this.state.imageDialogOpen && \n \n
\n );\n}\n","import React from 'react';\nimport MoreHorizIcon from '@material-ui/icons/MoreHoriz';\nimport IconButton from '@material-ui/core/IconButton';\nimport { connect } from 'react-redux';\nimport { Link } from 'react-router-dom';\nimport DeleteOutlineIcon from '@material-ui/icons/DeleteOutline';\nimport LinkIcon from '@material-ui/icons/Link';\nimport EditOutlinedIcon from '@material-ui/icons/EditOutlined';\nimport ReportProblemOutlinedIcon from '@material-ui/icons/ReportProblemOutlined';\nimport { deletePostAsync } from '../../services/postsService';\nimport { IAction, showInfoToastAction } from '../../redux/actions';\nimport PostDialog from '../CustomDialogs/PostDialog';\nimport AbuseDialog from '../CustomDialogs/AbuseDialog';\nimport { Post } from '../../Types';\nimport { getFriendlyTime } from '../../services/Helpers';\nimport PopMenu, { PopMenuButton } from '../CustomDialogs/PopMenu';\nimport { postDeleted } from '../../redux/reducers/eventsReducer';\nimport { ActionCreatorWithPayload } from '@reduxjs/toolkit';\nimport { RootState } from '../../redux/store';\nimport { ProfileState } from '../../redux/reducers/profileReducer';\n\ninterface Props {\n auth0Sub: string,\n data: Post\n showInfoToastAction: (payload: any) => IAction,\n postDeleted: ActionCreatorWithPayload\n
\n );\n }\n}\n\nfunction mapStateToProps(state: RootState) {\n return {\n loggedInUser: state.profile\n };\n}\n\nexport default connect(mapStateToProps, { showInfoToastAction, postDeleted })(PostHeading);","import React from 'react';\nimport '../../styles/read.scss';\nimport '../../styles/post.scss';\nimport { connect } from 'react-redux';\nimport PostFooter from './PostFooter';\nimport { Post } from '../../Types';\nimport PostBody from './PostBody';\nimport PostHeading from './PostHeading';\n\ntype Props = {\n auth0Sub: string,\n data: Post\n}\n\ntype State = {\n commentsCount: number\n}\n\nclass TimelinePost extends React.Component\n \n \n \n\n
\n\n {this.state.editDialogOpen && \n \n
\n\n \n {name}\n
\n \n \n {getFriendlyTime(this.props.data.createdAt)}\n {this.props.data.edited && •Edited}\n
\n \n \n {postCreatedByThisUser && \n
\n \n
\n );\n }\n}\n\nexport default connect(null, {})(TimelinePost)","import React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Card from '@material-ui/core/Card';\nimport CardHeader from '@material-ui/core/CardHeader';\nimport CardContent from '@material-ui/core/CardContent';\nimport Skeleton from '@material-ui/lab/Skeleton';\n\nconst useStyles = makeStyles((theme) => ({\n card: {\n margin: theme.spacing(2),\n },\n media: {\n height: 200,\n },\n}));\n\nfunction TimelineSkeleton() {\n const classes = useStyles();\n\n return (\n \n
\n );\n}\n\nexport default withScrollPercentage(withPosts(\"timeline\")(Timeline));","import React from 'react';\nimport '../styles/read.scss';\nimport profile_pic from '../imgs/profile_pic.jpg';\nimport read_wallpaper from '../imgs/read-wallpaper.jpg';\nimport { connect } from 'react-redux';\n\nclass Read extends React.Component {\n\n state = {}\n \n componentDidMount() {\n }\n\n render() {\n\n return (\n \n\n {loadingPosts ?\n (
\n Posts collection is empty.
:\n posts.map((post) => {\n return \n\n
\n );\n }\n}\n\nexport default connect(null, { })(Read)","import React from \"react\";\nimport loading from \"./loading.svg\";\n\n// const Loading = () => (\n// \n\n
\n Two Books That Turned a 26-Year-Old Programmer Into a Billionaire
\nFounder of Shopify on books that changed his life
\n\n\n 
\n\n
\n\n \n \n
\n\n August 22 2020
\n20k reads
\n\n\n
\n \n \n
\n 10k
\n\n \n
\n 104
\n\n \n
\n 200
\n\n 
\n
\n\n Some of the courses already available on ML University’s
\n\n
\n\n \n\n\n What are Neural networks?
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\n\nWhat are Neural networks?
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\n\nWhat are Neural networks?
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\nNeural networks are set of algorithms inspired by the functioning of human brian. Generally when you open your eyes, what you see is called data and is processed by the Nuerons(data processing cells) in your brain, and recognises what is around you. That’s how similar the Neural Networks works. They takes a large set of data, process the data(draws out the patterns from data), and outputs what it is.
\n\n// 
\n//
\n// );\n\nconst Loading = () => (\n \n \n \n
\n);\n\nexport default Loading;\n","const createImage = url =>\n new Promise((resolve, reject) => {\n const image = new Image()\n image.addEventListener('load', () => resolve(image))\n image.addEventListener('error', error => reject(error))\n image.setAttribute('crossOrigin', 'anonymous') // needed to avoid cross-origin issues on CodeSandbox\n image.src = url\n })\n\nfunction getRadianAngle(degreeValue) {\n return (degreeValue * Math.PI) / 180\n}\n\n/**\n * This function was adapted from the one in the ReadMe of https://github.com/DominicTobias/react-image-crop\n * @param {File} image - Image File url\n * @param {Object} pixelCrop - pixelCrop Object provided by react-easy-crop\n * @param {number} rotation - optional rotation parameter\n */\nexport default async function getCroppedImg(imageSrc, pixelCrop, filetype, rotation = 0) {\n const image = await createImage(imageSrc)\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n\n const maxSize = Math.max(image.width, image.height)\n const safeArea = 2 * ((maxSize / 2) * Math.sqrt(2))\n\n // set each dimensions to double largest dimension to allow for a safe area for the\n // image to rotate in without being clipped by canvas context\n canvas.width = safeArea\n canvas.height = safeArea\n\n // translate canvas context to a central location on image to allow rotating around the center.\n ctx.translate(safeArea / 2, safeArea / 2)\n ctx.rotate(getRadianAngle(rotation))\n ctx.translate(-safeArea / 2, -safeArea / 2)\n\n // draw rotated image and store data.\n ctx.drawImage(\n image,\n safeArea / 2 - image.width * 0.5,\n safeArea / 2 - image.height * 0.5\n )\n const data = ctx.getImageData(0, 0, safeArea, safeArea)\n\n // set canvas width to final desired crop size - this will clear existing context\n canvas.width = pixelCrop.width\n canvas.height = pixelCrop.height\n\n // paste generated rotate image with correct offsets for x,y crop values.\n ctx.putImageData(\n data,\n Math.round(0 - safeArea / 2 + image.width * 0.5 - pixelCrop.x),\n Math.round(0 - safeArea / 2 + image.height * 0.5 - pixelCrop.y)\n )\n\n // As Base64 string\n return canvas.toDataURL(filetype);\n\n // As a blob\n // return new Promise(resolve => {\n // canvas.toBlob(file => {\n // resolve(URL.createObjectURL(file))\n // }, 'image/jpeg')\n // })\n}\n\n//return a promise that resolves with a File instance\nexport function urltoFile(url, filename, mimeType) {\n mimeType = mimeType || (url.match(/^data:([^;]+);/) || '')[1];\n return (fetch(url)\n .then(function (res) { return res.arrayBuffer(); })\n .then(function (buf) { return new File([buf], filename, { type: mimeType }); })\n );\n}\n","import React from \"react\";\nimport TextField from '@material-ui/core/TextField';\nimport { withStyles } from '@material-ui/core/styles';\nimport Button from '@material-ui/core/Button';\nimport Dialog from '@material-ui/core/Dialog';\nimport MuiDialogContent from '@material-ui/core/DialogContent';\nimport IconButton from '@material-ui/core/IconButton';\nimport ImageIcon from '@material-ui/icons/Image';\nimport {\n hideToastAction, showInfoToastAction,\n showErrorToastAction, showSuccessToastAction, IAction, UpdateProfileAction, submittingAction\n} from '../../redux/actions'\nimport { connect } from 'react-redux';\nimport Constants from '../../Constants';\nimport \"@pathofdev/react-tag-input/build/index.css\";\nimport { updateUserProfileAsync } from '../../services/profileService';\nimport EditIcon from '@material-ui/icons/Edit';\nimport { useAuth0, withAuth0, WithAuth0Props } from '@auth0/auth0-react';\nimport Cropper from 'react-easy-crop';\nimport getCroppedImg, { urltoFile } from '../UserProfile/CropImage';\nimport { Profile, UpdateProfileRequest, UserInfo } from \"../../Types\";\nimport { Area, Point } from \"react-easy-crop/types\";\nimport { compare, ResembleSingleCallbackComparisonResult } from \"resemblejs\";\nimport '../../styles/dialog.scss';\nimport NCancelIcon from \"../NComponents/NCancelIcon\";\nimport NButton from \"../NComponents/NButton\";\n\n\ninterface EditProfileDialogProps extends WithAuth0Props {\n data: Profile,\n viewerUserId: string,\n open: boolean,\n handleClose: () => void,\n hideToastAction: () => void,\n submittingAction: () => void,\n showErrorToastAction: (payload: any) => IAction,\n showInfoToastAction: (payload: any) => IAction,\n showSuccessToastAction: (payload: any) => IAction,\n UpdateProfileAction: (userInfo: UserInfo) => IAction\n}\n\ntype EditProfileDialogState = {\n imageFile: any,\n disablePostButton: boolean,\n name: string,\n title: string,\n crop: any,\n zoom: any,\n aspect: any,\n InitialCroppedAreaPixels: any,\n initialSet: boolean,\n croppedAreaPixels: any,\n originalFileType: string\n}\n\nclass EditProfileDialog extends React.Component\n \n\n
\n );\n }\n}\n\nexport default connect(null, {\n hideToastAction,\n submittingAction,\n showErrorToastAction,\n showInfoToastAction,\n showSuccessToastAction,\n UpdateProfileAction\n})(withAuth0(EditProfileDialog))\n\n\nconst DialogContent = withStyles((theme) => ({\n root: {\n padding: theme.spacing(2),\n },\n}))(MuiDialogContent);\n","import React, { Component } from \"react\";\nimport EditProfileDialog from \"../CustomDialogs/EditProfileDialog\";\nimport { followUserAsync } from '../../services/profileService'\nimport { Profile } from \"../../Types\";\nimport NButton from \"../NComponents/NButton\";\nimport { handleGenericCounter } from \"../../services/Helpers\";\n\ntype ProfileHeadingProps = {\n isPersonalAccount: boolean,\n profile: Profile,\n viewerUserId: string,\n profileUserId: string\n}\n\ntype ProfileHeadingState = {\n openEditDialog: boolean,\n followUser: boolean,\n followersCount: number\n}\n\nclass ProfileHeading extends Component\n
\n\n );\n }\n}\n\nexport default ProfileHeading;","import React, { useEffect, useReducer, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { RootState } from '../../redux/store';\nimport { Profile } from '../../Types';\nimport { useAuth0 } from '@auth0/auth0-react';\nimport { getUserProfileAsync } from '../../services/profileService';\nimport { IAction } from '../../redux/actions';\nimport { Completed, Loading, LoadingNewProfile, UpdateFromRedux } from '../../redux/actionTypes';\nimport { useParams } from 'react-router-dom';\n\n\ninterface ExtraProps {\n loading: boolean,\n profile: null | Profile,\n fetchedFromServer: boolean\n}\n\ninterface RouteParamTypes {\n userId: string\n}\n\nconst profileReducer = (state: ExtraProps, action: IAction): ExtraProps => {\n switch (action.type) {\n case Loading: {\n return { ...state, loading: true, fetchedFromServer: true };\n }\n case LoadingNewProfile: {\n return { ...state, loading: true, fetchedFromServer: false, profile: null };\n }\n case Completed: {\n return { ...state, loading: false, profile: action.payload, fetchedFromServer: true };\n }\n case UpdateFromRedux: {\n const { name, title, picture } = action.payload;\n return { ...state, profile: { ...state.profile, name, title, picture } as Profile };\n }\n default: {\n return state;\n }\n }\n}\n\nvar previousProfileUserId: string | null = null;\n\nconst withProfile = () => (Component: any) => (childProps: any) => {\n\n const { user, isAuthenticated } = useAuth0();\n const profileInRedux = useSelector((state: RootState) => state.profile);\n\n const { userId } = useParams\n\n
\n\n {this.state.openEditDialog &&\n \n 
\n
\n\n \n
\n\n {profile.name}
\n {profile.title || \"\"}
\n\n \n\n
\n\n \n
\n\n \n {profile.postsCount}
\n Posts
\n \n
\n\n \n {this.state.followersCount}
\n Followers
\n \n
\n\n {profile.followingCount}
\n Following
\n \n {this.props.isPersonalAccount ?\n \n :\n
\n\n \n\n
\n );\n}\n\nexport default withProfile()(withScrollPercentage(withPosts(\"profile\")(UserProfile)));","import React from 'react';\nimport Snackbar from '@material-ui/core/Snackbar';\nimport MuiAlert from '@material-ui/lab/Alert';\nimport { hideToastAction, IAction } from '../redux/actions';\nimport Slide from '@material-ui/core/Slide';\nimport { connect } from 'react-redux';\nimport { ToastState } from '../redux/reducers/toastReducer';\nimport { RootState } from '../redux/store';\n\nfunction SlideTransition(props: any) {\n return \n\n
\n\n \n
\n\n \n {!posts || posts.length === 0 ?\n
\n No posts have been uploaded by this user.
\n :\n posts.map((post) => {\n return \n
}\n
\n )\n}\n\nexport default UserSearchItem;\n","import React, { useEffect, useState } from \"react\";\nimport Loading from '../Loading';\nimport DOMPurify from 'dompurify';\nimport { searchAsync } from '../../services/searchService';\nimport '../../styles/searchResults.scss';\nimport Pagination from '@material-ui/lab/Pagination';\nimport UserSearchCard from './UserSearchItem';\nimport { RouteComponentProps } from \"react-router-dom\";\nimport { SearchRequest } from \"../../Types\";\nimport { getDefaultSearchResult } from \"./SearchBar\";\n\n\nconst MaxUserSearchItemsPerPage = 20;\nexport default function SearchResults(props: RouteComponentProps) {\n\n const value = DOMPurify.sanitize(new URLSearchParams(props.history.location.search).get(\"value\") || \"\");\n const [loading, setLoading] = useState(true);\n const [page, setPage] = useState(1);\n const [data, setData] = useState(getDefaultSearchResult());\n\n useEffect(() => {\n const getData = async () => {\n let payload: SearchRequest = {\n value,\n page: page - 1,\n max: MaxUserSearchItemsPerPage\n }\n let data = await searchAsync(payload);\n setData(data || getDefaultSearchResult());\n setLoading(false);\n }\n\n getData();\n }, [page, value]);\n\n\n if (loading) {\n return \n\n
\n {!props.final && \n 
\n
\n\n \n
\n\n {data.name}
\n {data.title || \"\"}
\n \n
\n\n }\n
\n
\n );\n\n const requiredPages = data ? data.total < data.limit ? 1 : Math.ceil(data.total / data.limit) : 0;\n\n const handlePageChange = (event: React.ChangeEvent\n No results found for that search value\n
\n \n
\n );\n}\n\n","import React, { useEffect, useState } from 'react';\nimport '../../styles/home.scss';\nimport TimelinePost from '../TimelinePost';\nimport { useAuth0 } from '@auth0/auth0-react';\nimport TimelineSkeleton from '../TimelinePost/TimelineSkeleton';\nimport { Post } from '../../Types';\nimport { getSinglePostAsync } from '../../services/postsService';\nimport { useParams } from 'react-router';\nimport { useAppSelector } from '../../redux/store';\n\ninterface RouteParamTypes {\n postId: string\n}\n\nfunction SingleThread() {\n const { user } = useAuth0();\n const postsEvent = useAppSelector((state) => state.events.postsEvent);\n\n const { postId } = useParams\n\n {!data ?
\n \n {data.users.map((user, index) => {\n return (\n
\n }\n\n {requiredPages >= 2 &&\n \n
\n }\n\n \n
\n );\n}\n\nexport default SingleThread;","import React from \"react\"\nimport { Link } from \"react-router-dom\";\nimport styled from \"styled-components\";\nimport NButton from \"../NComponents/NButton\";\nimport { FaLinkedin } from 'react-icons/fa';\n\n\ninterface Props {\n onLogin: () => void\n}\n\nconst Heading = (props: Props) => {\n\n return (\n \n\n {loading ?\n (
\n Thread does not exist.
:\n \n \n \n Hikmasight\n \n (Preview)\n
\n\n \n Hikmasight\n \n (Preview)\n \n \n
\n \n
\n LinkedIn
\n \n Making life a meaningful spiritual adventure
\n A platform dedicated to spreading the Truth in all areas of life and learning from the people of knowledge around the world.\n
\n\n \n Why is my own existence to myself the least known?
\n\n Whence have I come, why this coming here?
\n Where to must I go, when will my home to me be shown?
\n\n Whatever is of the celestial realm, of that I speak
\n I am ready to go, my clothes are packed to be away thrown.
\n\n Joyous be that day that in search of the beloved
\n I take wing towards that land, upon that air I am flown.
\n\n Where is that ear that can hear my speech and song?
\n Who is the one who puts voice in this mouth of dust and stone?
\n\n I did not come here on my own accord, nor will I thus leave
\n He who brought me here, shall return me to my very own.
\n\n I am a bird of Paradise, I am not of the earthy realm
\n For a few days imprisoned in my cage of flesh and bone.
\n\n My soul is my guide, for my soul is of that abode
\n I will not speak of the earthly, I am of the unknown.
\n
Classic poem by Rumi
\n\n
\n\n \"You wander from room to room, hunting for the diamond necklace, that is already around your neck.\"
\nRumi
\n\n
\n\n \"In everybody there is a piece of flesh, if it is healthy, the whole body is healthy, and if it is sick, the whole body is sick.\n Beware! it is the heart!\"
\nProphet Muhammad pbuh
\n\n
\n \"The meaning of life is to find your gift. The purpose of life is to give it away.\"
\nPablo Picasso
\nCreated by Najmuddin Dost
\n.Net and React contractor
\nEmail: nnost@live.com
\n\n {isAuthenticated &&\n <>\n \n \n\n
\n );\n }\n}\n\nfunction mapStateToProps(state: RootState) {\n return {\n profilePicture: state.profile.picture\n };\n}\n\nexport default (connect(mapStateToProps, {})(withRouter(withAuth0(App))));","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","\nimport React from \"react\";\nimport { useHistory } from \"react-router-dom\";\nimport { Auth0Provider } from \"@auth0/auth0-react\";\n\nconst Auth0ProviderWithHistory = ({ children }) => {\n const domain = process.env.REACT_APP_AUTH0_DOMAIN;\n const clientId = process.env.REACT_APP_AUTH0_CLIENT_ID;\n const audience = process.env.REACT_APP_AUTH0_AUDIENCE;\n\n const history = useHistory();\n\n const onRedirectCallback = (appState) => {\n history.push(appState?.returnTo || window.location.pathname);\n };\n\n return (\n \n \n ( \n
\n\n