from Component_py.stubs import require, console, __pragma__ # __:skip
from Component_py.component import Component
from components.AlbumDetail import AlbumDetail
React = require("react")
ScrollView = require("react-native").ScrollView
__pragma__("skip")
def fetch(s):
return None
__pragma__("noskip")
class AlbumList(Component):
def __init__(self, props):
super().__init__(props)
self.state = {"albums": []}
def componentDidMount(self):
def parse(response):
return response.json()
def resolve(data):
self.setState({"albums": data})
def reject(error):
console.log(error)
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
React = require("react")
Text, View = destruct(require("react-native"), "Text", "View")
def Header(props):
view_style, text_style = styles.values()
return __pragma__(
"js", "{}", """ (
<View style={view_style}>
<Text style={text_style}>{props.header_text}</Text>
</View>
); """)
styles = _s = {
"viewStyle": {
"backgroundColor": "#F8F8F8",
"justifyContent": "center",
"alignItems": "center",
"height": 80,
"paddingTop": 25,
"shadowColor": "#000",
"shadowOffset": {
"width": 0,
"height": 2
},
"shadowOpacity": 0.2,
"elevation": 2,
from Component_py.stubs import __pragma__, require, document # __:skip
from app import App
React = require("react")
ReactDOM = require("react-dom")
app = __pragma__("xtrans", None, "{}", "<App />")
ReactDOM.render(app, document.getElementById("root"))
from Component_py.stubs import require # __:skip
from actions.types import FETCH_USERS, SET_USER
axios = require("axios")
def fetch_users():
return {
"type": FETCH_USERS,
"payload": axios.js_get("https://randomuser.me/api/?results=10")
}
def set_user(user):
return {"type": SET_USER, "payload": user}
from Component_py.stubs import require, __pragma__ # __:skip
React = require("react")
Link = require("react-router").Link
def UserItem(props):
thumbnail = props.user.picture.thumbnail
username = props.user.login.username
to_path = f"/user:{username}"
return __pragma__("xtrans", None, "{}", """ (
<Link
className="box"
onClick={props.onClick}
to={to_path}
>
<img src={thumbnail} />
<span>{username}</span>
</Link>
); """)
from Component_py.stubs import require, __pragma__ # __:skip
React = require("react")
View = require("react-native").View
def Card(props):
container_style, = styles.values()
return __pragma__(
"js", "{}", """ (
<View style={container_style}>
{props.children}
</View>
); """)
styles = {
"containerStyle": {
"borderWidth": 1,
"borderRadius": 2,
"borderColor": "#DDD",
"borderBottomWidth": 0,
"shadowColor": "#000",
"shadowOffset": {
"width": 0,
"height": 2
},
"shadowOpacity": 0.1,
"shadowRadius": 2,
"elevation": 1,
"marginLeft": 5,
"marginRight": 5,
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
from reducers.todo_list import todo_list_reducer
from reducers.login_user import login_user_reducer
from reducers.login_form import login_form_reducer
from reducers.form_panel import form_panel_reducer
createStore, combineReducers, applyMiddleware = destruct(
require("redux"), "createStore", "combineReducers", "applyMiddleware")
logger = require("redux-logger").createLogger
promise = require("redux-promise-middleware").js_default
thunk = require("redux-thunk").js_default
store = createStore(
combineReducers({
"todo_list": todo_list_reducer,
"login_user": login_user_reducer,
"login_form": login_form_reducer,
"form_panel": form_panel_reducer
}),
applyMiddleware(
thunk,
promise(),
logger()
)
)
from Component_py.stubs import require, __pragma__, document # __:skip
from containers.AppContainer import AppContainer
from store import store
React = require("react")
ReactDOM = require("react-dom")
Provider = require("react-redux").Provider
app = __pragma__("xtrans", None, "{}", """ (
<Provider store={store}>
<AppContainer />
</Provider>
); """)
ReactDOM.render(app, document.getElementById("root"))
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
React = require("react")
Form, FormGroup, Label, Input, Button = destruct(require("reactstrap"), "Form",
"FormGroup", "Label", "Input",
"Button")
def LoginForm(props):
def on_input_change(e):
props.login_form_update(e.target.id, e.target.value)
def on_submit_login(e):
username, password = destruct(props["login_form"], "username_text",
"password_text")
if username and password:
props.clear_login_form()
props.login_user(username, password)
e.preventDefault()
def on_click_register(e):
username, password = destruct(props["login_form"], "username_text",
"password_text")
if username and password:
props.clear_login_form()
props.register_user(username, password)
return __pragma__(
"xtrans", None, "{}", """ (
<Form className="padding" onSubmit={on_submit_login}>
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
from reducers.users import users_reducer
from reducers.user_profile import user_profile_reducer
createStore, combineReducers, applyMiddleware = \
destruct(require("redux"),
"createStore", "combineReducers", "applyMiddleware")
logger = require("redux-logger").createLogger
promise = require("redux-promise-middleware").js_default
users_store = createStore(
combineReducers({
"users": users_reducer,
"user_profile": user_profile_reducer
}), applyMiddleware(logger(), promise()))
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
from containers.LoginFormContainer import LoginFormContainer
from containers.FormPanelContainer import FormPanelContainer
from containers.ButtonPanelContainer import ButtonPanelContainer
from containers.TodoListContainer import TodoListContainer
React = require("react")
Form, Row, Col, Jumbotron = destruct(
require("reactstrap"), "Form", "Row", "Col", "Jumbotron")
def App(props):
def render_login_panel():
return __pragma__("xtrans", None, "{}", """ (
<div>
<h5>Please Login:</h5>
<LoginFormContainer />
</div>
); """)
def on_submit(e):
e.preventDefault()
def render_todo_panel():
return __pragma__("xtrans", None, "{}", """ (
<div>
<TodoListContainer />
<Form
className="padding"
onSubmit={on_submit}
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
React = require("react")
Text, TouchableOpacity = \
destruct(require("react-native"), "Text", "TouchableOpacity")
def Button(props):
button_style, text_style = styles.values()
return __pragma__("js", "{}", """ (
<TouchableOpacity
style={button_style}
onPress={props.onPress}>
<Text style={text_style}>
{props.children}
</Text>
</TouchableOpacity>
); """)
styles = {
"buttonStyle": {
"flex": 1,
"alignSelf": "stretch",
"backgroundColor": "#FFF",
"borderRadius": 5,
"borderWidth": 1,
"borderColor": "#007AFF",
"marginLeft": 5,
"marginRight": 5
},
from Component_py.stubs import require, __pragma__ # __:skip
React = require("react")
Button = require("reactstrap").Button
def ButtonPanel(props):
def on_click_add():
todo_text = props.form_panel["text"]
token = props.login_user["token"]
if todo_text:
props.add_new_todo(todo_text, token)
props.form_panel_update("")
def on_click_clear():
todo_text = props.form_panel["text"]
if todo_text:
props.form_panel_update("")
def on_click_logout():
on_click_clear()
props.logout_user()
return __pragma__(
"xtrans", None, "{}", """ (
<div className="flex-center">
<div className="flex-container">
<Button
className="fixed-height"
onClick={on_click_add}
color="success"
type="submit"
from Component_py.stubs import require, __pragma__ # __:skip
from components.navbar import Navbar
React = require("react")
def App(props):
return __pragma__("xtrans", None, "{}", """ (
<div className="appComp">
<Navbar />
<div>
<h1>This is our App component</h1>
{props.children}
</div>
</div>
); """)
from Component_py.stubs import require # __:skip
from actions.actions import fetch_all_todos, complete_todo, delete_todo
from components.TodoList import TodoList
connect = require("react-redux").connect
def mapStateToProps(state):
return {
"todo_list": state["todo_list"],
"login_user": state["login_user"]
}
def mapDispatchToProps(dispatch):
return {
"fetch_all_todos": lambda t: dispatch(fetch_all_todos(t)),
"complete_todo": lambda i, t: dispatch(complete_todo(i, t)),
"delete_todo": lambda i, t: dispatch(delete_todo(i, t))
}
TodoListContainer = connect(
mapStateToProps,
mapDispatchToProps
)(TodoList)
from Component_py.stubs import require, __pragma__, window # __:skip
from Component_py.component import Component, destruct
React = require("react")
ListGroup, ListGroupItem, Button = destruct(require("reactstrap"), "ListGroup",
"ListGroupItem", "Button")
RingLoader = require("react-spinners").RingLoader
FontAwesomeIcon = require("react-fontawesome")
class TodoList(Component):
def componentDidMount(self):
token = self.props.login_user["token"]
self.props.fetch_all_todos(token)
def on_click_complete(self, todo):
token = self.props.login_user["token"]
def closure():
if not todo["complete"]:
self.props.complete_todo(todo["id"], token)
return closure
def on_click_delete(self, todo):
token = self.props.login_user["token"]
def closure():
should_delete = True
if not todo["complete"] and not window.confirm(
"Delete incomplete Todo?"):
from Component_py.stubs import require, console # __:skip
from actions.types import (
FETCH_ALL_TODOS, COMPLETE_TODO, DELETE_TODO, ADD_NEW_TODO,
REGISTER_USER, REGISTER_USER_REJECTED, LOGIN_USER, LOGOUT_USER,
FORM_PANEL_UPDATE, LOGIN_FORM_UPDATE, CLEAR_LOGIN_FORM
)
axios = require("axios").create({"baseURL": "https://metamarcdw.pythonanywhere.com"})
def bearer(token):
return {
"headers": {
"Authorization": f"Bearer {token}"
}
}
def fetch_all_todos(token):
return {
"type": FETCH_ALL_TODOS,
"payload": axios.js_get("/todo", bearer(token))
}
def complete_todo(id_, token):
return {
"type": COMPLETE_TODO,
"payload": axios.put(f"/todo/{id_}", None, bearer(token))
}
from Component_py.stubs import require, __pragma__ # __:skip
from Component_py.component import destruct
React = require("react")
FormGroup, Label, Input = destruct(require("reactstrap"), "FormGroup", "Label",
"Input")
def FormPanel(props):
def on_text_change(e):
props.form_panel_update(e.target.value)
return __pragma__(
"xtrans", None, "{}", """ (
<FormGroup>
<Label for="text_input">Enter new todo text:</Label>
<Input
onChange={on_text_change}
value={props.form_panel.text}
id="text_input"
placeholder="What to do?" />
</FormGroup>
); """)
from Component_py.stubs import require, console, __pragma__ # __:skip
from Component_py.component import destruct
from components.Card import Card
from components.CardSection import CardSection
from components.Button import Button
React = require("react")
View, Text, Image, Linking = \
destruct(require("react-native"), "View", "Text", "Image", "Linking")
def AlbumDetail(props):
artist, image, thumbnail_image, title, url = \
destruct(props.album,
"artist", "image", "thumbnail_image", "title", "url")
(header_content_style, header_text_style, thumbnail_style,
thumbnail_container_style, image_style) = styles.values()
def on_press():
return Linking.openURL(url)
return __pragma__(
"js", "{}", """ (
<Card>
<CardSection>
<View style={thumbnail_container_style}>
<Image
source={{ "uri": thumbnail_image }}
style={thumbnail_style} />
</View>
<View style={header_content_style}>
