Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix old gates #68

Merged
merged 2 commits into from
Nov 4, 2021
Merged

Fix old gates #68

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fa7a0b9
Update template names to use mysilio-co/*
ianconsolata Nov 4, 2021
58e67ce
Update button styles for Gate editor in setings
ianconsolata Nov 4, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 8 additions & 3 deletions model/gnomes.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,9 @@ export const GnomeType = {
}

export const GateTemplate = {
SinglePageGate: "single-page-gate"
}
ConceptPage: 'concept-page',
LinkInBio: 'link-in-bio',
};

export const GnomeStatus = {
Deployed: 'deployed',
Expand All @@ -29,7 +30,11 @@ export function randomReadableId() {
export function newSinglePageGateThing(webId, conceptPrefix, index, concept, css) {
let thing = createThing()
thing = setStringNoLocale(thing, US.hasGnomeType, GnomeType.Gate)
thing = setStringNoLocale(thing, US.usesGateTemplate, GateTemplate.SinglePageGate)
thing = setStringNoLocale(
thing,
US.usesGateTemplate,
GateTemplate.ConceptPage
);
thing = setStringNoLocale(thing, US.conceptPrefix, conceptPrefix)
thing = setStringNoLocale(thing, US.usesCSS, css)
thing = setUrl(thing, US.monetizedFor, webId)
Expand Down
169 changes: 107 additions & 62 deletions pages/settings.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,64 +139,91 @@ function GnomeThingEditor({ webId, thing, updateThing, cancelAdd }) {
const currentCSS = thing && getStringNoLocale(thing, US.usesCSS)
return (
<div className="mb-12">
{ savingGate ? (
{savingGate ? (
<Loader />
) : (
editingGate ? (
<Formik
initialValues={{
conceptName: chosenConceptName,
css: currentCSS || ''
}}
validationSchema={SinglePageGateSchema}
onSubmit={save}
>
{({ errors, touched, setFieldValue, values: { conceptName } }) => (

<Form>
<div className="flex flex-col">
<div>
<h3 className="mb-3">What note would you like to use for your Gate?</h3>
) : editingGate ? (
<Formik
initialValues={{
conceptName: chosenConceptName,
css: currentCSS || '',
}}
validationSchema={SinglePageGateSchema}
onSubmit={save}
>
{({ errors, touched, setFieldValue, values: { conceptName } }) => (
<Form>
<div className="flex flex-col">
<div>
<h3 className="mb-3">
What note would you like to use for your Gate?
</h3>

{editingNoteName ? (
<NotePicker onSubmit={(newConceptName) => {
setFieldValue('conceptName', newConceptName)
{editingNoteName ? (
<NotePicker
onSubmit={(newConceptName) => {
setFieldValue('conceptName', newConceptName);
// we need to set this here so that the concept loader above will
// load the concept
setChosenConceptName(newConceptName)
setEditingNoteName(false)
setChosenConceptName(newConceptName);
setEditingNoteName(false);
}}
initialSelectedName={conceptName}/>
) : (
<div className="flex justify-between">
<h5 className="font-bold">{conceptName}</h5>
<button className="btn" onClick={() => setEditingNoteName(true)}>Pick a different note</button>
</div>
)}
</div>
<Field id="css" name="css"
as="textarea"
className="my-3"
placeholder="add custom css" />
{errors.css && touched.css ? <div className="text-red-500">{errors.css}</div> : null}
initialSelectedName={conceptName}
/>
) : (
<div className="flex justify-between">
<h5 className="font-bold">{conceptName}</h5>
<button
className="btn-md btn-filled btn-square h-10 ring-my-green text-my-green flex flex-row justify-center items-center"
onClick={() => setEditingNoteName(true)}
>
Pick a different note
</button>
</div>
)}
</div>
<Field
id="css"
name="css"
as="textarea"
className="my-3"
placeholder="add custom css"
/>
{errors.css && touched.css ? (
<div className="text-red-500">{errors.css}</div>
) : null}

<div className="flex mt-1">
<button className="btn" disabled={!conceptName} type="submit">Save and Deploy Gate</button>
<button className="btn" onClick={cancelEdit}>Cancel</button>
</div>
<div className="flex mt-1">
<button
className="btn-md btn-filled btn-square h-10 mr-1"
onClick={cancelEdit}
>
Cancel
</button>
<button
className="btn-md btn-filled btn-square h-10 ring-my-green text-my-green flex flex-row justify-center items-center"
disabled={!conceptName}
type="submit"
>
Save and Deploy Gate
</button>
</div>
</Form>
)}
</Formik>
) : (
<div className="flex justify-between mt-3">
<GnomeThingEntry thing={thing} />
<button className="btn" onClick={() => setEditingGate(true)}>Edit Gate</button>
</div>
))
}
</div >
)
</div>
</Form>
)}
</Formik>
) : (
<div className="flex justify-between mt-3">
<GnomeThingEntry thing={thing} />
<button
className="btn-md btn-filled btn-square h-10 ring-my-green text-my-green flex flex-row justify-center items-center"
onClick={() => setEditingGate(true)}
>
Edit Gate
</button>
</div>
)}
</div>
);
}

function GnomesResourceEditor({ webId }) {
Expand Down Expand Up @@ -229,22 +256,40 @@ function GnomesResourceEditor({ webId }) {
return (
<div className="mt-3">
{devMode && (
<button className="btn" onClick={() => { deleteResource(getSourceUrl(resource)) }}>
<button
className="btn-md btn-filled btn-square h-10 ring-my-green text-my-green flex flex-row justify-center items-center"
onClick={() => {
deleteResource(getSourceUrl(resource));
}}
>
Delete Gnomes Resource
</button>
)}
{ gnomeThings && gnomeThings.map((thing, i) => (
<GnomeThingEditor key={i}
{gnomeThings &&
gnomeThings.map((thing, i) => (
<GnomeThingEditor
key={i}
webId={webId}
thing={thing}
updateThing={updateThing}
/>
))}
{addingNewGnome ? (
<GnomeThingEditor
webId={webId}
thing={thing}
updateThing={updateThing} />
))}
{ addingNewGnome ?
(<GnomeThingEditor webId={webId} updateThing={updateThing} cancelAdd={cancel} />) :
(<button className="btn" onClick={() => setAddingNewGnome(true)}>Create a New Gate</button>)
}
updateThing={updateThing}
cancelAdd={cancel}
/>
) : (
<button
className="btn-md btn-filled btn-square h-10 ring-my-green text-my-green flex flex-row justify-center items-center"
onClick={() => setAddingNewGnome(true)}
>
Create a New Gate
</button>
)}
</div>
)
);
}

export default function Profile() {
Expand Down