Merge branch 'jon_new_layout' into dev
Jon Eugster
3 years ago
commit
205c484623
@ -1,5 +1,5 @@
|
|||||||
import { render, screen } from '@testing-library/react';
|
import { render, screen } from '@testing-library/react';
|
||||||
import App from './App';
|
import App from './app';
|
||||||
|
|
||||||
test('renders learn react link', () => {
|
test('renders learn react link', () => {
|
||||||
render(<App />);
|
render(<App />);
|
||||||
@ -1,5 +1,4 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { useState, useEffect } from 'react';
|
|
||||||
import { Outlet, useParams } from "react-router-dom";
|
import { Outlet, useParams } from "react-router-dom";
|
||||||
|
|
||||||
import '@fontsource/roboto/300.css';
|
import '@fontsource/roboto/300.css';
|
||||||
@ -1,13 +1,11 @@
|
|||||||
import * as React from 'react'
|
import * as React from 'react'
|
||||||
import { Button } from './Button'
|
import { useStore, useSelector } from 'react-redux';
|
||||||
import { GameIdContext } from '../App';
|
|
||||||
import { useStore } from 'react-redux';
|
|
||||||
import { useAppDispatch, useAppSelector } from '../hooks';
|
|
||||||
import { useSelector } from 'react-redux';
|
|
||||||
|
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
import { faDownload, faUpload, faEraser } from '@fortawesome/free-solid-svg-icons'
|
import { faDownload, faUpload, faEraser } from '@fortawesome/free-solid-svg-icons'
|
||||||
|
|
||||||
|
import { Button } from './button'
|
||||||
|
import { GameIdContext } from '../app';
|
||||||
|
import { useAppDispatch, useAppSelector } from '../hooks';
|
||||||
import { deleteProgress, selectProgress, loadProgress, GameProgressState } from '../state/progress';
|
import { deleteProgress, selectProgress, loadProgress, GameProgressState } from '../state/progress';
|
||||||
|
|
||||||
const downloadFile = ({ data, fileName, fileType }) => {
|
const downloadFile = ({ data, fileName, fileType }) => {
|
||||||
@ -1,7 +1,6 @@
|
|||||||
import { GameHint } from "./rpcApi";
|
import { GameHint } from "./infoview/rpc_api";
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { Alert, FormControlLabel, Switch } from '@mui/material';
|
import Markdown from './markdown';
|
||||||
import Markdown from '../Markdown';
|
|
||||||
|
|
||||||
export function Hint({hint} : {hint: GameHint}) {
|
export function Hint({hint} : {hint: GameHint}) {
|
||||||
return <div className="message info"><Markdown>{hint.text}</Markdown></div>
|
return <div className="message info"><Markdown>{hint.text}</Markdown></div>
|
||||||
@ -1,24 +1,20 @@
|
|||||||
import * as React from 'react'
|
import * as React from 'react'
|
||||||
import { useRef, useState, useEffect } from 'react'
|
import { useRef, useState, useEffect } from 'react'
|
||||||
import { LspDiagnosticsContext } from '../../../../node_modules/lean4-infoview/src/infoview/contexts';
|
|
||||||
import { useServerNotificationEffect } from '../../../../node_modules/lean4-infoview/src/infoview/util';
|
|
||||||
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'
|
|
||||||
import { DiagnosticSeverity, PublishDiagnosticsParams } from 'vscode-languageserver-protocol';
|
|
||||||
import { InputModeContext, MonacoEditorContext } from '../Level'
|
|
||||||
|
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
import { faWandMagicSparkles } from '@fortawesome/free-solid-svg-icons'
|
import { faWandMagicSparkles } from '@fortawesome/free-solid-svg-icons'
|
||||||
import { AbbreviationRewriter } from 'lean4web/client/src/editor/abbreviation/rewriter/AbbreviationRewriter';
|
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'
|
||||||
import { AbbreviationProvider } from 'lean4web/client/src/editor/abbreviation/AbbreviationProvider';
|
|
||||||
|
|
||||||
import { Registry } from 'monaco-textmate' // peer dependency
|
import { Registry } from 'monaco-textmate' // peer dependency
|
||||||
import { wireTmGrammars } from 'monaco-editor-textmate'
|
import { wireTmGrammars } from 'monaco-editor-textmate'
|
||||||
import * as lightPlusTheme from 'lean4web/client/src/lightPlus.json'
|
import { DiagnosticSeverity, PublishDiagnosticsParams } from 'vscode-languageserver-protocol';
|
||||||
|
import { useServerNotificationEffect } from '../../../../node_modules/lean4-infoview/src/infoview/util';
|
||||||
|
import { AbbreviationRewriter } from 'lean4web/client/src/editor/abbreviation/rewriter/AbbreviationRewriter';
|
||||||
|
import { AbbreviationProvider } from 'lean4web/client/src/editor/abbreviation/AbbreviationProvider';
|
||||||
import * as leanSyntax from 'lean4web/client/src/syntaxes/lean.json'
|
import * as leanSyntax from 'lean4web/client/src/syntaxes/lean.json'
|
||||||
import * as leanMarkdownSyntax from 'lean4web/client/src/syntaxes/lean-markdown.json'
|
import * as leanMarkdownSyntax from 'lean4web/client/src/syntaxes/lean-markdown.json'
|
||||||
import * as codeblockSyntax from 'lean4web/client/src/syntaxes/codeblock.json'
|
import * as codeblockSyntax from 'lean4web/client/src/syntaxes/codeblock.json'
|
||||||
import languageConfig from 'lean4/language-configuration.json';
|
import languageConfig from 'lean4/language-configuration.json';
|
||||||
|
|
||||||
|
import { InputModeContext, MonacoEditorContext } from './context'
|
||||||
|
|
||||||
/* We register a new language `leancmd` that looks like lean4, but does not use the lsp server. */
|
/* We register a new language `leancmd` that looks like lean4, but does not use the lsp server. */
|
||||||
|
|
||||||
@ -0,0 +1,75 @@
|
|||||||
|
/**
|
||||||
|
* @fileOverview This file contains the the react contexts used in the project.
|
||||||
|
*/
|
||||||
|
import * as React from 'react';
|
||||||
|
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'
|
||||||
|
import { InteractiveDiagnostic, InteractiveTermGoal } from '@leanprover/infoview-api';
|
||||||
|
import { InteractiveGoals } from './rpc_api';
|
||||||
|
|
||||||
|
export const MonacoEditorContext = React.createContext<monaco.editor.IStandaloneCodeEditor>(
|
||||||
|
null as any)
|
||||||
|
|
||||||
|
// TODO: Is this still used?
|
||||||
|
export const HintContext = React.createContext<{
|
||||||
|
showHiddenHints : boolean,
|
||||||
|
setShowHiddenHints: React.Dispatch<React.SetStateAction<boolean>>
|
||||||
|
}>({
|
||||||
|
showHiddenHints: true,
|
||||||
|
setShowHiddenHints: () => {},
|
||||||
|
});
|
||||||
|
|
||||||
|
export type InfoStatus = 'updating' | 'error' | 'ready';
|
||||||
|
|
||||||
|
export type ProofStep = {
|
||||||
|
// TODO: Add correct types
|
||||||
|
command : string
|
||||||
|
goals: string
|
||||||
|
hints: string
|
||||||
|
errors: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export const ProofContext = React.createContext<{
|
||||||
|
// The first entry will always have an empty/undefined command
|
||||||
|
proof: ProofStep[],
|
||||||
|
setProof: React.Dispatch<React.SetStateAction<Array<ProofStep>>>
|
||||||
|
}>({
|
||||||
|
proof: [],
|
||||||
|
setProof: () => {}
|
||||||
|
})
|
||||||
|
|
||||||
|
export interface ProofStateProps {
|
||||||
|
// pos: DocumentPosition;
|
||||||
|
status: InfoStatus;
|
||||||
|
messages: InteractiveDiagnostic[];
|
||||||
|
goals?: InteractiveGoals;
|
||||||
|
termGoal?: InteractiveTermGoal;
|
||||||
|
error?: string;
|
||||||
|
// userWidgets: UserWidgetInstance[];
|
||||||
|
// rpcSess: RpcSessionAtPos;
|
||||||
|
// triggerUpdate: () => Promise<void>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const ProofStateContext = React.createContext<{
|
||||||
|
proofState : ProofStateProps,
|
||||||
|
setProofState: React.Dispatch<React.SetStateAction<ProofStateProps>>
|
||||||
|
}>({
|
||||||
|
proofState : {
|
||||||
|
status: 'updating',
|
||||||
|
messages: [],
|
||||||
|
goals: undefined,
|
||||||
|
termGoal: undefined,
|
||||||
|
error: undefined},
|
||||||
|
setProofState: () => {},
|
||||||
|
});
|
||||||
|
|
||||||
|
export const InputModeContext = React.createContext<{
|
||||||
|
commandLineMode: boolean,
|
||||||
|
setCommandLineMode: React.Dispatch<React.SetStateAction<boolean>>,
|
||||||
|
commandLineInput: string,
|
||||||
|
setCommandLineInput: React.Dispatch<React.SetStateAction<string>>
|
||||||
|
}>({
|
||||||
|
commandLineMode: true,
|
||||||
|
setCommandLineMode: () => {},
|
||||||
|
commandLineInput: "",
|
||||||
|
setCommandLineInput: () => {},
|
||||||
|
});
|
||||||
@ -1,5 +1,8 @@
|
|||||||
/* This file is based on `vscode-lean4/vscode-lean4/src/rpcApi.ts ` */
|
/**
|
||||||
|
* @fileOverview Defines the interface for the communication with the server.
|
||||||
|
*
|
||||||
|
* This file is based on `vscode-lean4/vscode-lean4/src/rpcApi.ts`
|
||||||
|
*/
|
||||||
import { ContextInfo, FVarId, CodeWithInfos, MVarId } from '@leanprover/infoview-api';
|
import { ContextInfo, FVarId, CodeWithInfos, MVarId } from '@leanprover/infoview-api';
|
||||||
|
|
||||||
export interface GameHint {
|
export interface GameHint {
|
||||||
@ -1,19 +1,18 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate, Link } from "react-router-dom";
|
||||||
import { Link } from 'react-router-dom';
|
|
||||||
import Markdown from './Markdown';
|
|
||||||
|
|
||||||
import '@fontsource/roboto/300.css';
|
import '@fontsource/roboto/300.css';
|
||||||
import '@fontsource/roboto/400.css';
|
import '@fontsource/roboto/400.css';
|
||||||
import '@fontsource/roboto/500.css';
|
import '@fontsource/roboto/500.css';
|
||||||
import '@fontsource/roboto/700.css';
|
import '@fontsource/roboto/700.css';
|
||||||
|
|
||||||
import './LandingPage.css'
|
import './landing_page.css'
|
||||||
import {PrivacyPolicyPopup} from './PrivacyPolicy'
|
|
||||||
|
|
||||||
import coverRobo from '../assets/covers/formaloversum.png'
|
import coverRobo from '../assets/covers/formaloversum.png'
|
||||||
import bgImage from '../assets/bg.jpg'
|
import bgImage from '../assets/bg.jpg'
|
||||||
|
|
||||||
|
import Markdown from './markdown';
|
||||||
|
import {PrivacyPolicyPopup} from './privacy_policy'
|
||||||
|
|
||||||
const flag = {
|
const flag = {
|
||||||
'Dutch': '🇳🇱',
|
'Dutch': '🇳🇱',
|
||||||
'English': '🇬🇧',
|
'English': '🇬🇧',
|
||||||
@ -1,28 +1,21 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { useState, useEffect, useRef } from 'react';
|
import { useState, useEffect, useRef } from 'react';
|
||||||
import './welcome.css'
|
import { Link } from 'react-router-dom';
|
||||||
import cytoscape, { LayoutOptions } from 'cytoscape'
|
|
||||||
import klay from 'cytoscape-klay';
|
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector } from 'react-redux';
|
||||||
import Split from 'react-split'
|
import Split from 'react-split'
|
||||||
|
|
||||||
import GameMenu from './GameMenu';
|
|
||||||
import {PrivacyPolicy} from './PrivacyPolicy';
|
|
||||||
|
|
||||||
cytoscape.use( klay );
|
|
||||||
|
|
||||||
import { Box, Typography, CircularProgress } from '@mui/material';
|
import { Box, Typography, CircularProgress } from '@mui/material';
|
||||||
import { useGetGameInfoQuery } from '../state/api';
|
import cytoscape, { LayoutOptions } from 'cytoscape'
|
||||||
import { Link } from 'react-router-dom';
|
import klay from 'cytoscape-klay';
|
||||||
import Markdown from './Markdown';
|
import './welcome.css'
|
||||||
|
import { GameIdContext } from '../app';
|
||||||
import { selectCompleted } from '../state/progress';
|
import { selectCompleted } from '../state/progress';
|
||||||
import { GameIdContext } from '../App';
|
import { useGetGameInfoQuery } from '../state/api';
|
||||||
import { Button } from './Button';
|
import Markdown from './markdown';
|
||||||
|
import GameMenu from './game_menu';
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import {PrivacyPolicy} from './privacy_policy';
|
||||||
import { faDownload, faUpload, faEraser } from '@fortawesome/free-solid-svg-icons'
|
|
||||||
|
|
||||||
|
cytoscape.use( klay );
|
||||||
|
|
||||||
const N = 24 // max number of levels per world
|
const N = 24 // max number of levels per world
|
||||||
const R = 800 // radius of a world
|
const R = 800 // radius of a world
|
||||||
@ -1,14 +1,28 @@
|
|||||||
|
/**
|
||||||
|
* @fileOverview Load/save the state to the local browser store
|
||||||
|
*/
|
||||||
|
|
||||||
const KEY = "game_progress";
|
const KEY = "game_progress";
|
||||||
|
|
||||||
|
/** Load from browser storage */
|
||||||
export function loadState() {
|
export function loadState() {
|
||||||
try {
|
try {
|
||||||
const serializedState = localStorage.getItem(KEY);
|
const serializedState = localStorage.getItem(KEY);
|
||||||
if (!serializedState) return undefined;
|
if (!serializedState) return undefined;
|
||||||
return JSON.parse(serializedState);
|
let x = JSON.parse(serializedState);
|
||||||
|
// Complatibilty because `state.level` has been renamed to `x.games`.
|
||||||
|
// TODO: Does this work?
|
||||||
|
if (x.level) {
|
||||||
|
x.games = x.level
|
||||||
|
x.level = undefined
|
||||||
|
}
|
||||||
|
return x
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Save to browser storage */
|
||||||
export async function saveState(state: any) {
|
export async function saveState(state: any) {
|
||||||
try {
|
try {
|
||||||
const serializedState = JSON.stringify(state);
|
const serializedState = JSON.stringify(state);
|
||||||
Loading…
Reference in New Issue