Merge pull request #2367 from Avaiga/feature/#2263-convert-templates-…

…from-markdown-to-tgb

Feature/#2263 - Convert templates from markdown to tgb

taipy/templates/default/hooks/post_gen_project.py

@@ -77,33 +77,29 @@ def handle_single_page_app():
         main_file.write("\n")
         main_file.write("    gui = Gui(page=page)\n")
 
+    with open(os.path.join(os.getcwd(), "sections", "import.txt"), "a") as import_file:
+        import_file.write("import taipy.gui.builder as tgb\n")
+
     handle_run_service()
 
     with open(os.path.join(os.getcwd(), "sections", "page_content.txt"), "a") as page_content_file:
         page_content_file.write(
-            '''
-page = """
-<center>
-<|navbar|lov={[("home", "Homepage")]}|>
-</center>
+            """
+with tgb.Page() as page:
+    tgb.navbar(lov="{[('home', 'Homepage')]}")
 
 """
-'''
         )
 
 
 def handle_multi_page_app(pages):
     for page_name in pages:
         os.mkdir(os.path.join(os.getcwd(), "pages", page_name))
-        with open(os.path.join(os.getcwd(), "pages", "page_example", "page_example.md"), "r") as page_md_file:
-            page_md_content = page_md_file.read()
-        page_md_content = page_md_content.replace("Page example", page_name.replace("_", " ").title())
-        with open(os.path.join(os.getcwd(), "pages", page_name, page_name + ".md"), "w") as page_md_file:
-            page_md_file.write(page_md_content)
 
         with open(os.path.join(os.getcwd(), "pages", "page_example", "page_example.py"), "r") as page_content_file:
             page_py_content = page_content_file.read()
         page_py_content = page_py_content.replace("page_example", page_name)
+        page_py_content = page_py_content.replace("Page example", page_name.replace("_", " ").title())
         with open(os.path.join(os.getcwd(), "pages", page_name, page_name + ".py"), "w") as page_content_file:
             page_content_file.write(page_py_content)
 

taipy/templates/default/{{cookiecutter.__root_folder}}/pages/page_example/page_example.py

@@ -11,11 +11,12 @@
 
 """
 A page of the application.
-Page content is imported from the page_example.md file.
+Page content is built using the Page builder API.
 
-Please refer to https://docs.taipy.io/en/latest/manuals/userman/gui/pages for more details.
+Please refer to https://docs.taipy.io/en/latest/userman/gui/pages/builder/ for more details.
 """
 
-from taipy.gui import Markdown
+import taipy.gui.builder as tgb
 
-page_example = Markdown("pages/page_example/page_example.md")
+with tgb.Page() as page_example:
+    tgb.text("# Page example", mode="md")

taipy/templates/default/{{cookiecutter.__root_folder}}/pages/root.py

@@ -11,11 +11,12 @@
 
 """
 The root page of the application.
-Page content is imported from the root.md file.
+Page content is built using the Page builder API.
 
-Please refer to https://docs.taipy.io/en/latest/manuals/userman/gui/pages for more details.
+Please refer to https://docs.taipy.io/en/latest/userman/gui/pages/builder/ for more details.
 """
 
-from taipy.gui import Markdown
+import taipy.gui.builder as tgb
 
-root_page = Markdown("pages/root.md")
+with tgb.Page() as root_page:
+    tgb.navbar()

taipy/templates/sdm/{{cookiecutter.__root_folder}}/pages/job_page/job_page.py

@@ -9,6 +9,7 @@
 # an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
 # specific language governing permissions and limitations under the License.
 
-from taipy.gui import Markdown
+import taipy.gui.builder as tgb
 
-job_page = Markdown("pages/job_page/job_page.md")
+with tgb.Page() as job_page:
+    tgb.job_selector()

taipy/templates/sdm/{{cookiecutter.__root_folder}}/pages/root.py

@@ -9,10 +9,23 @@
 # an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
 # specific language governing permissions and limitations under the License.
 
-from taipy.gui import Markdown
+import taipy.gui.builder as tgb
 
 selected_scenario = None
 selected_data_node = None
 content = ""
 
-root = Markdown("pages/root.md")
+
+with tgb.Page() as root:
+    with tgb.layout(columns="1, 5"):
+        with tgb.part(class_name="sidebar"):
+            tgb.scenario_selector("{selected_scenario}")
+
+            with tgb.part(render="{selected_scenario}"):
+                tgb.data_node_selector("{selected_data_node}", display_cycles=False)
+
+        with tgb.part(class_name="main"):
+            tgb.navbar()
+
+            with tgb.part(class_name="main"):
+                tgb.text("{content}")

taipy/templates/sdm/{{cookiecutter.__root_folder}}/pages/scenario_page/scenario_page.py

@@ -9,7 +9,8 @@
 # an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
 # specific language governing permissions and limitations under the License.
 
-from taipy.gui import Markdown, notify
+import taipy.gui.builder as tgb
+from taipy.gui import notify
 
 from .data_node_management import manage_partial
 
@@ -27,4 +28,16 @@ def manage_data_node_partial(state):
     manage_partial(state)
 
 
-scenario_page = Markdown("pages/scenario_page/scenario_page.md")
+with tgb.Page() as scenario_page:
+    with tgb.layout(columns="1, 1"):
+        with tgb.part(render="{selected_scenario}"):
+            tgb.scenario(
+                "{selected_scenario}",
+                expandable=False,
+                expanded=True,
+                on_submission_change=notify_on_submission,
+            )
+
+            tgb.scenario_dag("{selected_scenario}")
+
+        tgb.part(partial="{data_node_partial}", render="{selected_data_node}")

tests/templates/test_default_template.py

@@ -145,7 +145,7 @@ def test_multipage_gui_template(tmpdir):
 
     assert sorted(os.listdir(os.path.join(tmpdir, "foo_app"))) == sorted(["requirements.txt", "main.py", "pages"])
     assert sorted(os.listdir(os.path.join(tmpdir, "foo_app", "pages"))) == sorted(
-        ["name_1", "name_2", "name_3", "root.md", "root.py", "__init__.py"]
+        ["name_1", "name_2", "name_3", "root.py", "__init__.py"]
     )
 
     taipy_path = os.getcwd()