Add modal for alerting that is neccesary to fork the project. Remove unused import component (#554)
This commit was merged in pull request #554.
This commit is contained in:
committed by
GitHub
parent
549217e953
commit
ae05a79e58
@@ -12,7 +12,6 @@ import CaptureButton from 'src/components/CaptureButton/CaptureButton'
|
|||||||
import { useIdeContext } from 'src/helpers/hooks/useIdeContext'
|
import { useIdeContext } from 'src/helpers/hooks/useIdeContext'
|
||||||
import Gravatar from 'src/components/Gravatar/Gravatar'
|
import Gravatar from 'src/components/Gravatar/Gravatar'
|
||||||
import EditableProjectTitle from 'src/components/EditableProjecTitle/EditableProjecTitle'
|
import EditableProjectTitle from 'src/components/EditableProjecTitle/EditableProjecTitle'
|
||||||
import SocialCardModal from 'src/components/SocialCardModal/SocialCardModal'
|
|
||||||
|
|
||||||
const FORK_PROJECT_MUTATION = gql`
|
const FORK_PROJECT_MUTATION = gql`
|
||||||
mutation ForkProjectMutation($input: ForkProjectInput!) {
|
mutation ForkProjectMutation($input: ForkProjectInput!) {
|
||||||
@@ -60,13 +59,15 @@ export default function IdeHeader({
|
|||||||
context: 'ide' | 'profile'
|
context: 'ide' | 'profile'
|
||||||
}) {
|
}) {
|
||||||
const { currentUser } = useAuth()
|
const { currentUser } = useAuth()
|
||||||
const { project } = useIdeContext()
|
const { project, state } = useIdeContext()
|
||||||
|
const hasUnsavedChanges = project?.code && state?.code && project?.code !== state?.code
|
||||||
|
|
||||||
const isProfile = context === 'profile'
|
const isProfile = context === 'profile'
|
||||||
const canEdit =
|
const canEdit =
|
||||||
(currentUser && currentUser?.sub === project?.user?.id) ||
|
(currentUser && currentUser?.sub === project?.user?.id) ||
|
||||||
currentUser?.roles?.includes('admin')
|
currentUser?.roles?.includes('admin')
|
||||||
const projectOwner = project?.user?.userName
|
const projectOwner = project?.user?.userName
|
||||||
|
const showForkMessage = !canEdit && hasUnsavedChanges
|
||||||
|
|
||||||
const [createFork] = useMutation(FORK_PROJECT_MUTATION, {
|
const [createFork] = useMutation(FORK_PROJECT_MUTATION, {
|
||||||
onCompleted: ({ forkProject }) => {
|
onCompleted: ({ forkProject }) => {
|
||||||
@@ -205,11 +206,17 @@ export default function IdeHeader({
|
|||||||
<TopButton
|
<TopButton
|
||||||
onClick={handleFork}
|
onClick={handleFork}
|
||||||
name="Fork"
|
name="Fork"
|
||||||
className=" bg-ch-blue-650 bg-opacity-30 hover:bg-opacity-80 text-ch-gray-300"
|
className={ showForkMessage ? " bg-ch-blue-650 bg-opacity-80 hover:bg-opacity-100 text-ch-gray-300 border-blue-300 border-2"
|
||||||
|
: " bg-ch-blue-650 bg-opacity-30 hover:bg-opacity-80 text-ch-gray-300" }
|
||||||
>
|
>
|
||||||
<Svg name="fork-new" className="w-6 h-6 text-ch-blue-400" />
|
<Svg name="fork-new" className="w-6 h-6 text-ch-blue-400" />
|
||||||
</TopButton>
|
</TopButton>
|
||||||
)}
|
)}
|
||||||
|
{currentUser?.sub && showForkMessage && (
|
||||||
|
<div className="fixed bg-white w-60 h-10 top-20 right-20 z-10 rounded-md font-bold text-sm flex p-2 items-center">
|
||||||
|
<Svg name="exclamation-circle" className="text-red-400 w-8 h-8 mx-2"/> Fork to save your work
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
Reference in New Issue
Block a user